有人知道如何解决此问题吗?
已设置超时以防止 2秒后发生鼠标滚轮事件,但是您可以尝试连续上下滚动,直到停止滚动才可以阻止它。
此错误仅在Chrome,Firefox和Edge正常工作时出现。
const preventDefault = (e) =>{
e.preventDefault()
}
const setEvent = () => {
setTimeout(() => {
window.addEventListener("mousewheel", preventDefault, { passive: false });
window.addEventListener("DOMMouseScroll", preventDefault, { passive: false });
console.log('Stopped!')
document.querySelector('div').style.display = 'block'
}, 2000)
}
setEvent()
document.querySelector('button').addEventListener('click', () =>{
document.querySelector('div').style.display = 'none'
window.removeEventListener("mousewheel", preventDefault, { passive: false });
window.removeEventListener("DOMMouseScroll", preventDefault, { passive: false });
setEvent()
})
section{
background: linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
}
.as-console-row:not(:last-of-type){
display: none
}
.content{
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-width: 500px;
text-align: center;
}
h1{
font-family: 'Arial';
font-size: 24px;
margin: 0 0 20px;
color: #fff
}
<section style="height: 1000vh"></section>
<div class="content" style="display: none">
<h1>Scroll prevented after 2 seconds but you can still scroll until you stop scrolling</h1>
<button>Try again</button>
</div>