setInterval在一次后停止

Question

// .items direct child
var itemsContainer = $('.blog-ticker').children();
// each item in .items
var items = $('.blog-ticker').children().children();        
setInterval(function(){
    var i = 0;
    itemsContainer.css({
        'top': -(items[i].clientHeight)+'px'
    });
    if(i <= items.length) {
        i++;
    }
}, 2000);

在第一轮结束后停止......混乱开始了。我该怎么办？

Answer 1

不可能在第一轮之后不会停止。

问题是，每次运行该功能时，您都要将i声明为0，因此您只需将第一项设置为相同的位置，并且出现即可无所事事。

你只需要在函数之外声明i，它应该可以正常工作：

// .items direct child
var itemsContainer = $('.blog-ticker').children();
// each item in .items
var items = $('.blog-ticker').children().children();        
// counter
var i = 0;
setInterval(function(){
    itemsContainer.css({
        'top': -(items[i].clientHeight)+'px'
    });
    if(i <= items.length) {
        i++;
    }
}, 2000);