jquery - 滚动经过 x 像素后执行函数

Question

这个问题已经有答案了:

jQuery Animating Elements by Scrolling the page (2 个回答)

已关闭 9 年前。

我在我的网站上进行了绝对定位的导航。

我创建了一个类来将其固定在屏幕顶部。

我试图找出的是在窗口向下滚动页面 x 像素量(在本例中为 500 px)后如何执行功能(在本例中为 toggleClass)

Answer 1

程序是:

• 监听滚动事件以检测用户滚动时的滚动位置
• 计算元素距页面顶部的位置，或确定距页面顶部的固定距离(在您的示例中为 500 像素)
• 当滚动位置大于触发位置时，执行该函数。如果您只想让函数触发一次，请删除函数中的滚动监听器。

假设 jQuery，是这样的:

$(window).on('scroll', function() {
    scrollPosition = $(this).scrollTop();
    if (scrollPosition >= 500) {
        // If the function is only supposed to fire once
        $(this).off('scroll');

        // Other function stuff here...
    }
});