[英]How to disable/enable page scroll
我正在尝试编写一个禁用/启用页面滚动的JS代码。 Chrome显然存在问题-控制台显示此错误
Unable to preventDefault inside passive event listener due to target being treated as passive.
这是我的JS代码:
var keys = [32,33,34,35,36,37,38,39,40];
function preventDefault(e) {
e = e || window.event;
if (e.preventDefault)
e.preventDefault();
e.returnValue = false;
}
function keydown(e) {
for (var i = keys.length; i--;) {
if (e.keyCode === keys[i]) {
preventDefault(e);
return;
}
}
}
function wheel(e) {
preventDefault(e);
}
function disable_scroll() {
if (window.addEventListener) {
window.addEventListener('DOMMouseScroll', wheel, false);
}
window.onmousewheel = document.onmousewheel = wheel;
document.onkeydown = keydown;
disable_scroll_mobile();
}
function enable_scroll() {
if (window.removeEventListener) {
window.removeEventListener('DOMMouseScroll', wheel, false);
}
window.onmousewheel = document.onmousewheel = document.onkeydown = null;
enable_scroll_mobile();
}
// MOBILE
function disable_scroll_mobile(){
document.addEventListener('touchmove',preventDefault, false);
}
function enable_scroll_mobile(){
document.removeEventListener('touchmove',preventDefault, false);
}
我试图使用此小技巧↓解决它。 我在eventListener
添加了{ passive: false }
,但是这样做没有帮助:
function disable_scroll() {
if (window.addEventListener) {
window.addEventListener('DOMMouseScroll', wheel, { passive: false });
}
window.onmousewheel = document.onmousewheel = wheel;
document.onkeydown = keydown;
disable_scroll_mobile();
}
function enable_scroll() {
if (window.removeEventListener) {
window.removeEventListener('DOMMouseScroll', wheel, { passive: false });
}
window.onmousewheel = document.onmousewheel = document.onkeydown = null;
enable_scroll_mobile();
}
用于测试目的的代码笔位于https://codepen.io/wesleypimentel/full/KpgXJW
在滚动上,您可以为身体提供样式
body {
overflow-y: hidden;
}
或简单的js
document.body.style.overflow = 'hidden';
在函数调用
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.