Öğenin en üste kaydırılıp kaymadığını kontrol edin

Question

Bir öğenin ~ 100px'lik bir kayma ile yukarı kaydırılıp kaydırılmadığını kontrol etmek istiyorum.

5 altyazı ve arka plan yapmak için 2 sınıflı bir sayfam var.

$('.background1', '.background2').position(function(){ 
      if($(this).position().top == 100){ 
      alert('checkThis'); 
     } 
     }); 

bu düşünüyorum:

<div class="background1"> 
Content1 
</div> 
<div class="background2"> 
Content2 
</div> 
<div class="background1"> 
Content3 
</div> 
<div class="background2"> 
Content4 
</div> 
<div class="background1"> 
Content5 
</div> 

Şimdi ben bu sınıfların birinin Bu benim son trys biridir

kaydırarak üst ulaştığında, kontrol etmek istiyorum: Bu şuna benzer şimdi benim en yakın denemem ... tabii ki bu kod document.ready içinde ve kodumun sonunda ....

TLDR: Bir öğenin en üste kaydırılıp ilerlemediğini nasıl kontrol edersiniz (ve bazı ofsetler) ?

Answer 1

Ardından anda kaydırılan mesafeye karşı her elemanını kontrol kaydırma olayını dinlemek zorunda gibi bir şey:

$(window).on('scroll', function() { 
    var scrollTop = $(this).scrollTop(); 

    $('.background1, .background2').each(function() { 
     var topDistance = $(this).offset().top; 

     if ((topDistance+100) < scrollTop) { 
      alert($(this).text() + ' was scrolled to the top'); 
     } 
    }); 
});