jQuery addClass延遲到可見元素

Question

我想爲當前在窗口中的每個元素添加一個類，並在多米諾效應之間延遲。

我已經做了延遲很好，但增加了類到所有匹配的元素，而不僅僅是在視圖中。

$(document).ready(function() { 
    $('.box').each(function(i){ 
    if($(this).scrollTop() <= $(window).scrollTop() + $(window).height()) { 
     var tile = $(this); 
     setTimeout(function() { 
     tile.addClass('visible'); 
     }, 500*i); 
    }; 
    }); 
}); 

Answer 1

您不希望檢查箱子的scrollTop。你想被檢查爲offset().top

這應該工作：

$(document).ready(function() { 
    $('.box').each(function(i){ 
    if($(this).offset().top <= $(window).scrollTop() + $(window).height()) { 
     var tile = $(this); 
     setTimeout(function() { 
     tile.addClass('visible'); 
     }, 500*i); 
    }; 
    }); 
});