如何在頁面上滾動一定數量的像素後觸發事件？ Javascript或Jquery

Question

我想從頂部滾動頁面300px時觸發視頻。這個作品，如果我滾動

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

，但我想它打一次我滾動300像素

Answer 1

您可以檢查$(document).scrollTop()

嘗試：

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

編輯

因爲我們不想要電影t Ø發揮每次他們滾動超出300像素時間的視頻播放完畢後，你可以取消綁定事件

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

DEMO