我有一组行类,当您滚动到它们的顶部时,我需要打印每个类的索引。
<div class="row">Hello world 1</div>
<div class="row">Hello world 2</div>
<div class="row">Hello world 3</div>
<div class="row">Hello world 4</div>
<div class="row">Hello world 5</div>
<div class="row">Hello world 6</div>
所以当我滚动到例如第 3 行我希望它打印“您滚动到 div nr 3”。
我试过类似的东西,但它没有按预期工作。
$(window).on("scroll", function() {
$.each($(".row"), function(index, item) {
if($(item).offset().top + $(item).height() >= $(window).height()) {
console.log("You scrolled to div nr: " + $(item).index());
}
});
});
如何实现?
最佳答案
如果我正确理解您的要求,那么这应该可以满足您根据滚动位置打印当前 div(位于屏幕顶部)的要求:
$(window).on("scroll", function() {
$.each($(".row"), function(index, item) {
var top = $(item).offset().top
var offset = $(window).scrollTop() // Use window.scrollTop rather than height
if(offset + $(item).height() >= top) {
console.log("You scrolled to div nr: " + $(item).index());
}
});
});
主要区别在于 $(window).scrollTop()
的使用,它根据窗口的当前滚动位置偏移了“顶部最可见的 div”的选择
关于javascript - 当你滚动到它时获取一组 div 的索引,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51921485/