jQuery遅延のある可視要素へのクラスの追加

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); 
    }; 
    }); 
});