javascript - 从顶部滚动页面一定数量的像素后如何触发事件？Javascript 或 Jquery

Question

当我从顶部滚动页面 300 像素时，我试图触发视频。如果我滚动，这有效

window.onscroll = function(event) {
myvideo.play();
}

但我希望它在滚动 300 像素后播放

Answer 1

你可以检查$(document).scrollTop()

尝试：

 $(document).bind("scroll", function(){    
    if ($(document).scrollTop() >= 300) {
       myvideo.play();
    }
});

编辑

因为我们不希望在视频播放后每次滚动超过 300 像素时播放电影，您可以取消绑定事件

$(document).bind("scroll.myScroll", function(){    
    if ($(document).scrollTop() >= 300) {
        myvideo.play();
        $(document).unbind('.myScroll');
    }
});

演示