jquery - 滚动超过x像素后执行功能

Question

我在我的网站上制作了一个绝对定位的导航.

我做了一个课程,把它固定在屏幕的顶部.

我试图找出的是如何在窗口滚动后执行一个函数(在这个例子中为toggleClass)x向下页面的像素数量(在这个例子中为500像素)

Answer 1

程序是:

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

假设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...
    }
});