Question

我有9个元素的列表（＆lt; li＆gt;）

我想要实现的目标是：只显示列表中的前3个元素，5秒后隐藏前3个并显示下3个，然后再次隐藏这3个并显示下3个，所以隐藏当前3并显示下一个3循环..

这是我尝试编写的内容，但在我的代码中，我尝试通过点击链接调用该操作..

jQuery('#lbrecentcarousel li:gt(2)').hide();

jQuery('#lbrecentdiv h2 a').live('click',function() {
jQuery('#lbrecentcarousel li').not(':visible').each( function() {

    jQuery(this).slideDown();

});
});

请有人帮我解决这个问题......谢谢

Answer 1

写：

setInterval(function(){
    var index = $("li:visible:last").index();
    var len = $("li").length;
    var open = 3;
    $("li:visible").hide();
    if(index == len-1){
        $("li:lt("+open+")").slideDown();
    }
    else{
        $("li").slice(index+1,index+open+1).slideDown();        
    }    
},1000);

<强> Working demo here.

Answer 2

谢谢大家，我通过编写这段代码对其进行了分类：

var elements = jQuery("#lbrecentcarousel li");
var index = 0;

var showNextThree = function (index) {
    if (index >= elements.length) {
        index = 0;
    }
    console.log(index);
    elements.hide().slice(index, index+3).fadeToggle();
    setTimeout(function () {
        showNextThree(index + 3)
    }, 5000);
}
showNextThree(0);

仅显示列表中的前3个元素，然后显示下3个循环

2 个答案: