一旦滚动击中该部分,我希望某个页面停止在特定内容上。它只会在满足特定条件后才会继续滚动(即,绘制某些东西,单击该 div 中的某些东西等)
你如何做到这一点?有任何想法吗?谢谢。
您可以通过在文档滚动上绑定处理程序并调用 e.preventDefault() 来阻止默认滚动操作。
这里,contentPos 是要停止滚动的 y 位置(以像素为单位),它与 $(document).scrollTop() 进行比较。
$(document).
bind( 'mousewheel DOMMouseScroll', function ( e ) {
contentYPos = 500;
conditionMet = false;
if ($(document).scrollTop() >= contentYPos
&& conditionMet == false
&& e.originalEvent.wheelDelta < 0) {
e.preventDefault();
}
});
这将检查您的 conditionMet 是否为假,并且如果用户向下滚动(假设您希望窗口仍然能够向上滚动),它将覆盖该操作,直到满足条件。
这是一个显示此工作的 js fiddle:http: //jsfiddle.net/cMKh2/
编辑:包括一个更全面的版本,在窗口滚动时触发。(包括两种方法进行比较)。
Edit2:最终版本通过按钮按下和动态滚动距离改变了条件。