滚动时：如果scrollTop（）等于或达到值execute事件

Question

我正在尝试在向下滚动到某个点/值时触发事件，然后在向上和向下滚动时再次执行。

我试过了：

$(window).scroll(function(){
    var sTop = $(this).scrollTop();

    if(sTop == 300){
        //execute event - failed
    }

});

上述内容不会通过鼠标滚轮和拖动滚动条触发任何内容。但当我将条件更改为大于或等于时，事件正在执行，但在向下滚动时多次执行。

if(sTop >= 300){
    //execute event - success
}

我也尝试更改条件值，有时候会触发事件。

if(sTop == 333 /* or 431, 658, etc. */){
    //execute event - sometimes success
}

这是我的测试fiddle。

如果你快速滚动，scroll()函数有时会跳过一个值吗？

有人可以解释这个问题并帮助我解决如何在$(window).scrollTop() == 'value'时触发事件的方法。感谢

Answer 1

您正面临这个问题，因为无法保证滚动将以1为增量进行。例如，某些滚轮的值增加为30.这意味着您将在30,60处获得滚动事件，90等。

测试滚动是否达到极限的最佳方法是查看它是否已超过您想要的点，然后将滚动重置为您想要的精确点。所以你要这样做：

if(sTop >= 300){
    $(window).scrollTop(300);
}

以下是一个更新的JSFiddle链接，其中包含一个工作示例：http://jsfiddle.net/bC3Cu/4/

如果您查看unit of increment in scrollable areas / divs in javascript?，它会介绍如何将其设置为覆盖滚动增量的位置。使用该方法，您应该能够预测用户滚动的单位数量，而不会阻止他们向下滚动页面。