[英]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.