如何在OSX中禁用多次滚动效果，并在每次滚动时仅触发一次滚动事件

Question

我需要像jquery.fullPage那样组织导航：当我滚动一次时，就会移到下一节。

我尝试使用jquery.mousewheel，但在MacOS上使用触摸板、轨迹板或APPLE Magic鼠标失败：它会一次滚动多个幻灯片。

我尝试使用这个解决方案：https://github.com/jquery/jquery-mousewheel/issues/36#issuecomment-67648897 在Chrome中它运行良好，但在FF中却不行，在Safari中有错误。

这是问题的简单演示：http://jsfiddle.net/ss5LueLx/13/

$slider.on('mousewheel', function(event) {
    if (event.deltaY>0) {
        slider.prevSlide();
    } else {
        slider.nextSlide();
    }
});

- Max Vorozhcov

Answer 1

我在我的SeaMonkey浏览器中测试了这个语句，但它失败了。

var delta  = e.type == 'mousewheel' ? e.originalEvent.wheelDelta * -1 : 40 * e.originalEvent.detail;

以防万一，我查看了deltaY并且它起作用了：在一个方向上是+1，在另一个方向上是-1，就像你在其他两个实现中确定的那样。

console.log(e.deltaY); // view console in FireBug

通过 Firebug 查看事件结构，我可以看到事件类型是 “mousewheel”，但是在 originalEvent 中没有 wheelData 字段。虽然有 detail 字段，但是它始终为零。

我想你可能正在尝试只有当达到 +/-3 时才去下一个项目。我建议采用以下方法来完成此操作：

// somewhere, initialize to zero
var current_position = 0;


// on mousewheel events
current_position += e.deltaY;

// you had a x 40 which would indicate that the limit is about 120 / 40
// if 3 is too small, you can always increase it to 5 or event 10...
if(current_position <= -3)
{
  slider.nextSlide();
  current_position = 0;
}
else if(current_position >= 3)
{
  slider.prevSlide();
  current_position = 0;
}

否则，您可以验证您的allowScroll标志是否按预期工作。我不以那种方式编程对象，所以我不太确定它是否正确。(我使用prototype语法，这在扩展类时非常有用。)

- Alexis Wilke