javascript - 滚动时捕获第一个可见的 div id(视口(viewport))

Question

我有这个页面:

我想在滚动时捕获我所在的 div。

我知道如果我使用:

if( $(document).scrollTop() > $('#div1').position().top) {  
console.log('Div1')
  }

...它将捕获 div1 但不是为每个 div 使用此代码我想为所有 div 设置 1 个代码段

类似于:

var a =   // The div i am at
if( $(document).scrollTop() > $(a).position().top) {    
    console.log($(a).attr('id'))
}

我正在寻找类似于视口(viewport)的东西:http://www.appelsiini.net/projects/viewport/3x2.html

我可以在没有插件的情况下实现吗，只需 2-3 行？

Answer 1

这是一个很好的方法。您可能希望使用像素偏移优化“<=”以改善用户体验，并将 div 选择器 ($divs) 移到回调之外以提高性能。看看我的 fiddle :http://jsfiddle.net/brentmn/CmpEt/

$(window).scroll(function() {

    var winTop = $(this).scrollTop();
    var $divs = $('div');

    var top = $.grep($divs, function(item) {
        return $(item).position().top <= winTop;
    });
});