Question

我在我的网站上使用此脚本作为我的Slider。我希望滑块能够在标签之间自动切换。我让它处理点击事件但我需要它以设定的间隔在标签之间旋转。任何人都可以帮助我会很好吗？

JS：

$(document).ready(function() {
    //Default Action
    $(".tab_content").hide(); //Hide all content
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab
    $(".tab_content:first").show(); //Show first tab content
    //On Click Event
    $("ul.tabs li").click(function() {
            $("ul.tabs li").removeClass("active"); //Remove any "active" class
            $(this).addClass("active"); //Add "active" class to selected tab
            $(".tab_content").hide(); //Hide all tab content
            var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
            $(activeTab).fadeIn(); //Fade in the active content
            return false;
     });
});

HTML：

<div style="float:left; width:290px; height:243px;">
    <ul class="tabs">{loop:navigation}
        <li>    <a style="color:#fff; text-decoration:none;" href="#tab{navigation:id}">
                {navigation:headline}<br />
                {navigation:text}
            </a>

        </li>{stop:navigation}</ul>
</div>
<div style="float:left; width:558px; height:243px;">{loop:specials}
    <div id="tab{specials:id}" class="tab_content"> <a href="http://{specials:url}" title=""><img src="{page:path}{specials:pic}" width="{specials:width}" height="{specials:height}" alt="" /></a>
    </div>
    {stop:specials}
</div>

Answer 1

从这里（或quickfix）最简单的方法是在一个时间间隔内触发点击功能：

setInterval(function(){ $("ul.tabs li").click(); }, 5000); // 5 seconds

.click()与.trigger('click')相同，因此您可以使用您更喜欢的那个。

在我的淡出脚本中包含自动切换

1 个答案: