demo

Question

我使用以下教程为我的主页创建精选内容滑块 - http://www.queness.com/post/274/jquery-sliding-tab-menu-for-sidebar-tutorial

我想知道的是，如何修改代码以在x秒后自动滚动到下一个选项卡？我假设我需要setInterval并触发该函数内部的某些内容，但我无法弄明白。

任何帮助将不胜感激！感谢

Answer 1

使用该tuturial作为来源，可以

setInterval(function(){
    if ($('a.selected').next().length)
       $('a.selected').next().click();
    else 
       $('a[rel=panel]').first().click();
},2000);

demo

Answer 2

为该页面上的每个点击处理程序定义了一个函数：

$('a[rel=panel]').click(function () {

    //Get the height of the sub-panel
    var panelheight = $($(this).attr('href')).height();

    //Set class for the selected item
    $('a[rel=panel]').removeClass('selected');
    $(this).addClass('selected');

    //Resize the height
    $('#mask').animate({'height':panelheight},{queue:false, duration:500});         

    //Scroll to the correct panel, the panel id is grabbed from the href attribute of the anchor
    $('#mask').scrollTo($(this).attr('href'), 800);     

    //Discard the link default behavior
    return false;
});

因此，对于您要滚动到的每个标签，触发某个标签的最简单方法是（对于第一个面板）$("#panel-1 ").triggerHandler("click");。

这样做：

var amount = 1;
setInterval(function(){
    $("#panel-"+amount).triggerHandler("click");
    if(amount == 4)
        amount = 1;
}, 1000);

jQuery选项卡修改为自动滚动

2 个答案:

demo