Question

我正在使用jQuery插件idTabs [[www.sunsean.com/idTabs] [1]]，它允许我通过元素#id和元素href =“＃id”

好的，所以我使用这个片段：

<script type="text/javascript">
$(document).ready(function() {
 $("#requestPool").idTabs();
 $(".tabs").idTabs();
 $(".miniTabs").idTabs(".active"); 
 $(".switchers").idTabs(".activePanel");
});
</script>

要在两个不同的区域运行插件：div#requestPool这有它自己的标签和它自己的标签内容，另外div.tabs是另一个地方，并且有自己的标签和它自己的标签内容。

div.miniTabs和div.switchers是包含标签链接（标签标题）的div，我将它们放在代码段中，将默认选定的标签类从.selected更改为{{1} }和.active

现在，我想要添加的是在浏览它们时对我的标签内容的一个很好的淡入淡出和淡入淡出效果。

由于

以下是其中一个标签区域的HTML代码：

.activePanel

非常感谢（同样标签工作非常精细，但没有我想要的淡化效果）。

Answer 1

我已经检查了你提到的页面，在高级部分有一个解决方案 - ＆gt;动画。我修改了一下并进行了测试，看起来很好：

在<head>：

<script type="text/javascript">
$(function(){
    $(".miniTabs").idTabs(function(id,list,set){ 
        $("a",set).removeClass("active").filter("a[href='"+id+"']").addClass("active"); 
        for(i in list)$(list[i]).hide();
        $(id).fadeIn(); 
        return false; 
    }); 
});
</script>

在<body>：

<div id="requestPool">
 <div class="miniTabs">
  <a href="#today" class="active">Today</a>
  <a href="#tomorrow">Tomorrow</a>
  <a href="#friday">Friday</a>
  <a href="#saturday">Saturday</a>
  <a href="#sunday">Sunday</a>
 </div>
 <div id="today"class="miniTab">Today</div>
 <div id="tomorrow"class="miniTab">Tomorrow</div>
 <div id="friday"class="miniTab">Friday</div>
 <div id="saturday"class="miniTab">Saturday</div>
 <div id="sunday"class="miniTab">Sunday</div>
</div>

干杯

-G。

如何将fadeIn和fadeOut添加到idTabs插件的JS片段？

1 个答案: