检查用户是否使用触控板滚动？
我创建了一个网站，用户可以使用鼠标滚动或向上/向下箭头滚动浏览图库。 它正如我想要的那样工作，并且在用鼠标滚动时更改一个图像pr滚动。 但是，如果用户使用触控板滚动，则几乎不可能一次滚动单个图像。
所以我的问题是：有没有办法检查用户是否通过触控板滚动，然后更改滚动的行为，因此它变得不那么敏感，从而更容易一次滚动单个图像？
我不是很擅长jquery，到目前为止，我的解决方案已经从几个脚本中组合在一起：
http://jsfiddle.net/MukuMedia/PFjzX/33/
希望可以有人帮帮我 ：）
不，这是不可能的。 我能想到的唯一解决方案是设置滚动速度的限制。 我不会尝试解密您的代码，但我建议将timedOut变量初始化为零，每次滚动到新图像时设置为1。 使用setTimeout()将其设置为零，比如50ms。 在滚动到新图像之前，请检查此timedOut变量，并仅在其为零时滚动。 （确保将setTimeout放在timedOut检查内，否则每次timedOut移动时都会不断调用它，这不是你想要的。）
我发现这里的幻数是40。
似乎使用触控板（可能还有魔术鼠标），delta增加了40倍。
即使您取回普通鼠标并稍后滚动它也会保持这种状态。
所以我做了，使用jquery mousewheel插件 ：
b.mousewheel(function(evt,delta,deltaX,deltaY){ if(Math.abs(deltaY)>=40) deltaY/=40; if(Math.abs(deltaX)>=40) deltaX/=40; //Do your stuff here. });
我使用我创建的“section-change”插件遇到了类似的问题。 我结束了用“动画”变量解析它：仅当此变量设置为“false”时，wheel动作才有效，一旦触发该变量，变量将切换为“true”，然后我将变量切换回“false”动画完成了。 希望这可以帮助！
这几乎是DC_建议的内容。 想我发布这个，因为它是一个实际的实现。
// similar to _.debounce, but was having issues with it, so I made this. function rateLimit(func, time){ var callback = func, waiting = false, context = this; var rtn = function(){ if(waiting) return; waiting = true; var args = arguments; setTimeout(function(){ waiting = false; callback.apply(context, args); }, time); }; return rtn; } function onWheel(e){ // Add your code here } // will only fire a maximum of 10 times a second var debouncedOnWheel = rateLimit(onWheel, 100); window.addEventListener("wheel", debouncedOnWheel);
我找到了一个检测用户是否使用触摸板的解决方案。 它工作得很好，只有两个小缺点。
首先，它会在第一次触发事件后检测到mousescroll，因此只需单击鼠标滚动即可。 但这只是第一次。 然后我们可以缓存导致第二个小问题的值。 当用户使用触控板和带滚轮的鼠标时，它会检测首先使用的内容。 对我来说，这些问题可以忽略不计。 这里的代码
var scrolling = false; var oldTime = 0; var newTime = 0; var isTouchPad; var eventCount = 0; var eventCountStart; var mouseHandle = function (evt) { var isTouchPadDefined = isTouchPad || typeof isTouchPad !== "undefined"; console.log(isTouchPadDefined); if (!isTouchPadDefined) { if (eventCount === 0) { eventCountStart = new Date().getTime(); } eventCount++; if (new Date().getTime() - eventCountStart > 50) { if (eventCount > 5) { isTouchPad = true; } else { isTouchPad = false; } isTouchPadDefined = true; } } if (isTouchPadDefined) { // in this if-block you can do what you want // i just wanted the direction, for swiping, so i have to prevent // the multiple event calls to trigger multiple unwanted actions (trackpad) if (!evt) evt = event; var direction = (evt.detail<0 || evt.wheelDelta>0) ? 1 : -1; if (isTouchPad) { newTime = new Date().getTime(); if (!scrolling && newTime-oldTime > 550 ) { scrolling = true; if (direction < 0) { // swipe down } else { // swipe up } setTimeout(function() {oldTime = new Date().getTime();scrolling = false}, 500); } } else { if (direction < 0) { // swipe down } else { // swipe up } } } } document.addEventListener("mousewheel", mouseHandle, false); document.addEventListener("DOMMouseScroll", mouseHandle, false);