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

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

我看起来像视口:http://www.appelsiini.net/projects/viewport/3x2.html

我可以在没有插件的情况下实现这一目标,只需2-3行吗？

Answer 1

这是一个很好的方法.您可能希望使用像素偏移优化'<='以改善用户体验并在回调之外移动div选择器($ divs)以提高性能.看看我的小提琴: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;
    });
});