Question

假设我有不同大小的div：

<div class="mydiv" style="height:500px;">
</div>
<div class="mydiv" style="height:212px;">
</div>
<div class="mydiv" style="height:58px;>
</div>

我怎么能这样做，当我向下滚动时，我知道当前正在显示/或在顶部的#div？假设一次只能存在1个活动div（最顶层的div）。最好使用JQuery。

Answer 1

我想你可能正在寻找像这样的东西

http://foundation.zurb.com/docs/components/magellan.html

还有很多相似且容易获得的东西。

Answer 2

或者，如果您不想要第三方库中的任何额外依赖项，您可以订阅$('#container').scroll(eventHandler)事件并循环访问e.target的子项以查找位于顶层的子项容器。

$(".container").scroll(function (e) {
    var elementOnTheTop;
    $(e.target).children().each(function (index, element) {
        var $element = $(element);
        if ($element.position().top <= 0 && $element.height() > 0) {
            elementOnTheTop = $element;
        }
    });

    //elementOnTheTop is what you are looking for
});

DEMO ：JSFiddle

如何在滚动时跟踪div编号？

2 个答案: