javascript - 如何在osx中??禁用多滚动效果并触发每次滚动一次滚动事件(How to disable multiple-scroll effect in osx and fire scroll event once per scroll)

Question

I need to organise navigation like jquery.fullPage: when I scroll once - I move to next section.

(我需要组织类似于jquery.fullPage的导航：滚动一次时-移至下一部分。)

I tried to use jquery.mousewheel for it, but it fails in MacOS with touchpad or trackpad or APPLE Magic Mouse: It scrolls multiple slides per one scroll.

(我尝试将其用于jquery.mousewheel，但在MacOS中使用触摸板或触控板或APPLE Magic Mouse失败：它每滚动一卷即可滚动多个幻灯片。)

I tried to use this solution: https://github.com/jquery/jquery-mousewheel/issues/36#issuecomment-67648897

(我试图使用此解决方案： https : //github.com/jquery/jquery-mousewheel/issues/36#issuecomment-67648897)

It works fine in Chrome, but it does not in FF and has bugs in Safari.

(它在Chrome中可以正常运行，但在FF中则不能，并且在Safari中存在错误。)

This is simple demonstration of issue: http://jsfiddle.net/ss5LueLx/13/

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

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

  ask by Max Vorozhcov translate from so

Answer 1

I tested this statement in my SeaMonkey browser and it fails.

(我在SeaMonkey浏览器中测试了此语句，但失败了。)

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

Just in case, I looked at the deltaY and it works: +1 in one direction and -1 in the other, just as you determined in the other two implementations you have.

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

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

Looking at the event structure in Firebug, I can see that the event type is "mousewheel", and yet I do not see a wheelData field in the originalEvent.

(查看Firebug中的事件结构，可以看到事件类型为“ mousewheel”，但是在originalEvent中却看不到wheelData字段。)

And although there is a detail field, but that one remains at zero.

(而且，尽管有一个明细字段，但该字段仍为零。)

I would imagine that you are attempting to go to the next item only once you reach +/-3.

(我想您仅在达到+/- 3后才尝试转到下一个项目。)

I would suggest something of the sort to accomplish this feat:

(我建议采取某种措施来实现这一壮举：)

// 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;
}

Otherwise you could verify that your allowScroll flag works as expected.

(否则，您可以验证allowScroll标志是否按预期工作。)

I do not program objects that way so I am not too sure whether it is correct or not.

(我不会以这种方式编程对象，因此我不太确定它是否正确。)

(I use the prototype syntax which is useful if you want to extend classes.)

(（我使用prototype语法，如果要扩展类，该语法很有用。）)