我是 JavaScript 的新手并成功地完成了这个滚轮事件,但它一直在触发,这将使我进入不同的元素并滚动到下一个元素,因为我正在使用 nextElementSibling
.
我尝试过限制它,但到目前为止还没有成功,因为我对 JS 还不够好,想了解更多。
var scrollableElement = document.querySelector('body');
scrollableElement.addEventListener('wheel', findScrollDirectionOtherBrowsers);
function findScrollDirectionOtherBrowsers(event) {
var delta;
var aktiv = document.querySelector('.swap');
if (event.wheelDelta) {
delta = event.wheelDelta;
} else {
delta = -1 * event.deltaY;
}
if (delta < 0) {
aktiv.nextElementSibling.classList.toggle('swap')
aktiv.classList.toggle('swap')
} else if (delta > 0) {
aktiv.previousElementSibling.classList.toggle('swap')
aktiv.classList.toggle('swap')
}
}
因此,只要函数至少在 2 秒前被触发或被触发 3-4 次,结果应该立即切换 .swap。那是我所期望的,但也许您可以为我提供更好的解决方案?这一定非常棒!非常感谢你的帮助! :)
最佳答案
我只是添加了一个计数器来实现它。到目前为止工作正常。
var scrollableElement = document.querySelector('body');
//new
var i = 0;
scrollableElement.addEventListener('wheel', findScrollDirectionOtherBrowsers);
function findScrollDirectionOtherBrowsers(event) {
var delta;
var aktiv = document.querySelector('.swap');
if (event.wheelDelta) {
delta = event.wheelDelta;
//new
i++;
} else {
delta = -1 * event.deltaY;
}
//new && i > 15 and set back to 0
if (delta < 0 && i > 15) {
i = 0;
aktiv.nextElementSibling.classList.toggle('swap')
aktiv.classList.toggle('swap')
//new && i > 15 and set back to 0
} else if (delta > 0 && i > 15) {
i = 0;
aktiv.previousElementSibling.classList.toggle('swap')
aktiv.classList.toggle('swap')
}
}
关于javascript - 你如何每隔几个轮子滴答声或每隔几秒调用一个轮子函数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58734177/