Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
219 views
in Technique[技术] by (71.8m points)

javascript - 如何暂时禁用滚动?(How to disable scrolling temporarily?)

I'm using the scrollTo jQuery plugin and would like to know if it is somehow possible to temporarily disable scrolling on the window element through Javascript?(我使用的是scrollTo jQuery插件,想知道是否可以通过Java临时禁用window元素上的滚动吗?)

The reason I'd like to disable scrolling is that when you scroll while scrollTo is animating, it gets really ugly ;)(我要禁用滚动的原因是,当您在scrollTo设置动画时滚动时,它真的很难看;)) Of course, I could do a $("body").css("overflow", "hidden");(当然,我可以做一个$("body").css("overflow", "hidden");) and then put it back to auto when the animation stops, but it would be better if the scrollbar was still visible but inactive.(然后在动画停止时将其重新设置为自动,但是如果滚动条仍然可见但处于非活动状态会更好。)   ask by Olivier Lalonde translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

The scroll event cannot be canceled.(scroll事件无法取消。)

But you can do it by canceling these interaction events:(但是您可以通过取消以下交互事件来做到这一点:)
Mouse & Touch scroll and Buttons associated with scrolling.(鼠标 触摸滚动以及与滚动相关的按钮 。) [ Working demo ]([ 工作演示 ]) // left: 37, up: 38, right: 39, down: 40, // spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36 var keys = {37: 1, 38: 1, 39: 1, 40: 1}; function preventDefault(e) { e = e || window.event; if (e.preventDefault) e.preventDefault(); e.returnValue = false; } function preventDefaultForScrollKeys(e) { if (keys[e.keyCode]) { preventDefault(e); return false; } } function disableScroll() { if (window.addEventListener) // older FF window.addEventListener('DOMMouseScroll', preventDefault, false); document.addEventListener('wheel', preventDefault, {passive: false}); // Disable scrolling in Chrome window.onwheel = preventDefault; // modern standard window.onmousewheel = document.onmousewheel = preventDefault; // older browsers, IE window.ontouchmove = preventDefault; // mobile document.onkeydown = preventDefaultForScrollKeys; } function enableScroll() { if (window.removeEventListener) window.removeEventListener('DOMMouseScroll', preventDefault, false); document.removeEventListener('wheel', preventDefault, {passive: false}); // Enable scrolling in Chrome window.onmousewheel = document.onmousewheel = null; window.onwheel = null; window.ontouchmove = null; document.onkeydown = null; } EDIT(编辑) Added document.addEventListener('wheel', preventDefault, {passive: false});(添加了document.addEventListener('wheel', preventDefault, {passive: false});) to ensure the function still works on Chrome.(以确保该功能在Chrome上仍然有效。)

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...