darsain / sly

JavaScript library for one-directional scrolling with item based navigation support.
http://darsa.in/sly
2.87k stars 497 forks source link

Mac OS X Scrolling Behavior #211

Closed thejae closed 9 years ago

thejae commented 9 years ago

This seems to be related to issue #57.

It seems under Mac OS, the scrolling is behaving in a very erratic way. I made a video showing the problem. The browser in the video is Safari but this also occurs in Chrome.

https://www.youtube.com/watch?v=ejlPZ7shrUw

0:01 Dragging the frame works fine 0:09 Magic mouse scrolling 0:17 Trackpad scrolling

Mac OS X Yosemite 10.10.4 Safari 8.0.7 Chrome 43.0.2357.134 (64-bit)

darsain commented 9 years ago

What seems to be happening here is that scrolling is using tweening animation that relies on easing function and speed options.

If speed option is too big, and/or you are using an easing function with too slow initial curve (such as easeInExpo), that, combined with very rapid frequency of wheel events triggered on trackpad, results in tweening animation being restarted before it can start doing anything.

The solution would be setting speed to something like 100, and using easing function with steep initial curve, such as easeOutExpo (you need jquery easing plugin to have this function available):

speed: 100,
easing: 'easeOutExpo',

If that'll still be unacceptable, I'd like to ask you to record the same video, but with this example:

http://codepen.io/anon/pen/vOaxWo

so I can see what exactly is happening with the wheel events.

thejae commented 9 years ago

Thanks for the prompt reply. That worked!