因此，我只想在用户每次通过鼠标滚轮向上或向下滚动时触发一次函数。看：jsFiddle 演示 http://jsfiddle.net/y4eUF/2/。问题是，即使我有 e.preventDefault()，该函数仍然会触发多次。
目标是每当用户向上或向下滚动时该函数仅触发一次。与此类似site http://www.thepetedesign.com/demos/onepage_scroll_demo.html.
这是我到目前为止的代码：
var sq = {};
sq = document;
if (sq.addEventListener) {
sq.addEventListener("mousewheel", MouseWheelHandler(), false);
sq.addEventListener("DOMMouseScroll", MouseWheelHandler(), false);
} else {
sq.attachEvent("onmousewheel", MouseWheelHandler());
}
function MouseWheelHandler() {
return function (e) {
var e = window.event || e;
var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
if (delta < 0) {
/* Scroll Down */
e.preventDefault();
console.log("Down. I want this to happen only once");
} else {
/* Scroll Up */
console.log("up. I want this to happen only once");
e.preventDefault();
}
return false;
}
return false;
}
This https://github.com/jquery/jquery-mousewheel/issues/36#issuecomment-59883575帮助了我：
var isMoving=false;
$(document).bind("mousewheel DOMMouseScroll MozMousePixelScroll", function(event, delta) {
event.preventDefault();
if (isMoving) return;
navigateTo();
});
function navigateTo(){
isMoving = true;
setTimeout(function() {
isMoving=false;
},2000);
}
基本上你有一个 isMoving 变量，它的设置取决于你的动画或你所做的任何事情是否正在进行。即使用户在一次“轻拂”中使用鼠标滚轮滚动多次，该函数也只会触发一次。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
