gpt4 book ai didi

php - 选择后加载隐藏选项卡图像

转载 作者:行者123 更新时间:2023-12-02 19:11:14 25 4
gpt4 key购买 nike

我使用 idtabs js 在主页中制作选项卡。

http://www.sunsean.com/idTabs/

我在每个选项卡上放了 12 张图像。当页面加载时,首先加载选项卡 div,并且标题和菜单图像不会首先加载。所以需要 4 分钟等待页面加载完成。

我想在加载页面中首先加载主图像,然后加载默认选项卡图像,当我选择其他选项卡时加载选项卡上的图像???

<div id="tabs" dir="rtl">
<ul class="tabNavigation">
<li><a href="#topdownload" style="font:12px tahoma;">top</a></li>
<li><a href="#featured" style="font:12px tahoma">more</a></li>
<li><a href="#toprated" style="font:12px tahoma">defult</a></li>
<li><a href="#latest" style="font:12px tahoma;" >free</a></li>
</ul>
</div>

最佳答案

看来您使用的插件非常基本,并且不允许ajax请求。

一种解决方案是对外部 html 文件(featured.htm、toperated.html...)使用加载方法,但是我确信有更好的方法使用 ajax 请求服务器和预加载插件。

HTML

<html>
<head>
...
<script src="http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js"></script>
</head>
<body>
...
<!-- tabs -->
<ul class="css-tabs">
<li><a href="topdownload.htm">top</a></li>
<li><a href="featured.htm">more</a></li>
<li><a class="selected" href="toprated.htm">default</a></li>
<li><a href="latest.htm">free</a></li>
</ul>

<!-- single pane. it is always visible -->
<div class="css-panes">
<div style="display:block">
<!-- loaded content here -->
</div>
</div>

Jquery

现在我们使用ajax加载外部页面,使用load方法获取链接元素的href:

<script>
$(function() {
$("ul.css-tabs").tabs("div.css-panes > div", {
effect: 'fade',
onBeforeClick: function(event, i) {
// get the pane to be opened
var pane = this.getPanes().eq(i);
// only load once. remove the if ( ... ){ } clause if
// you want the page to be loaded every time
if (pane.is(":empty")) {
// load it with a page specified in the tab's href
// attribute
pane.load(this.getTabs().eq(i).attr("href"));
}
}
});
});
</script>

演示

http://jquerytools.org/demos/tabs/ajax-noeffect.htm

关于php - 选择后加载隐藏选项卡图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13678892/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com