jquery - 更改jQuery选项卡上的类旋转更改？

Question

我正在使用 jQuery 和 JQUI 在我的网站上做一个“特色滑块”：http: //calibur.8wayrun.com/

它使用如下代码（我已经编辑了所有非必要的信息，因为它只是在这里作为我正在做的事情的快速总结）。

<script type="text/javascript">
jQuery(document).ready(function() {
    $("#recentSlider2").tabs({
        fx:{opacity: "toggle"}
    }).tabs("rotate", 5000, true);
});
</script>

<div id="recentSlider2">
    <div class="recentSlider2 rightSlider">
        <div id="fragment-1"></div>
        <div id="fragment-2"></div>
        <div id="fragment-3"></div>
            etc...
        <ul>
            <li id="nav-fragment-1"></li>
            <li id="nav-fragment-2"></li>
            <li id="nav-fragment-3"></li>
                etc...
        </ul>
    </div>
</div>

简单吧？好吧，如果您注意到，父 div 类是“recentSlider2 rightSlider”。在每次选项卡更改时，我希望滑块将“rightSlider”替换为“leftSlider”，并将“leftSlider”替换为“rightSlider”。这只是为了模拟每次幻灯片更改时从左到右的反弹。

这样的事情可能吗？如果是这样，我该怎么做？

Answer 1

您应该能够绑定到tabsselect事件：

$("#recentSlider2").bind('tabsselect', function(event, ui) {
      $(ui.tab).closest(".recentSlider2")
          .toggleClass("rightSlider")
          .toggleClass("leftSlider");
  });