ayamflow/virtual-scroll

Issue on Firefox with trackpad

Opened this issue ยท 11 comments

I realized this because of using locomotive scroll and thought the issue is there, but they use virtual-scroll and for me it looks like the issue lays in following line:

evt.deltaY = e.wheelDeltaY || e.deltaY * -1

Basically, if I'm in Firefox and using a trackpad, the scrolling is way too fast.

if I only use
evt.deltaY = e.deltaY * -1;
instead of
evt.deltaY = e.wheelDeltaY || e.deltaY * -1;

it looks like it's the same behaviour as in chrome again, so maybe somethin inside Firefox changed regarding wheelDeltaY or something

Hi @jankohlbach !
Thanks for looking into it. I had not heard about this issue before but I think it would be great to find a fix for VirtualScroll.
I think the fix will probably use something similar to what's on this stackoverflow answer to toggle between wheelDeltaY and deltaY.

I am not sure when I will be able to incorporate this as a stable fix, so in the meantime, a temporary fix could be something like:

new VirtualScroll({
    mouseMultiplier: isTrackpad && isFirefox ? 1/3 : 1
})

where isTrackpad comes from the above stackoverflow link, and isFirefox is obtained from user-agent sniffing.
1/3 is because I believe the trackpad will fire at 300% the rate of the mouse but I could be wrong - tweak at will.
Let me know if that works for you!

Edit: it looks like wheelDetaX/Y are deprecated so I might just remove them altogether. Just need to test a bit.

Hey @ayamflow,
thanks for the response :)
It's extremely busy for me as well right now, so don't worry.
Thanks for looking into it ๐Ÿ’ฏ

Hey @ayamflow ,
do you have any news regarding this? asking because the folks at locomotive are working on the issues and making updates, so maybe it would be nice if this is fixed

hey @jankohlbach,
I looked at https://locomotivemtl.github.io/locomotive-scroll/ on Chrome & Firefox and the scroll speed looks the same to me, on a trackpad.
Can you confirm that you see an obvious difference on this site between Firefox and other browsers? What OS are you on?

@ayamflow
hmm ... yeah it's pretty obvious ๐Ÿ˜…
I'm on windows 10, dell xps13, are you on a mac?
maybe it's even device related ...

Yep, I'm on mac.
I just gave it a try on Windows 10 with Parallels desktop and there was no noticeable speed difference either. It's the same trackpad tho so maybe it's a device thing, but it's surprising that it would only affect firefox ๐Ÿค”
Does this shows isTrackpad: true for you ? https://jsfiddle.net/ayamflow/j09qsrLd/7/ (when scrolling in the white rect)

I'm thinking I could expose another param trackpadMultiplier: 1 (default) and let the user find the best value for their use case, as I don't want to add a breaking behavior.

as much as I'd like to see more people using firefox, in this case it's a good thing only few people (and even less with trackpad) are using it ๐Ÿ˜‚
your fiddle shows nothing for me ๐Ÿค”
maybe also your idea from above could be enough for the moment then ...

@jankohlbach you need to scroll in the white area for the jsfiddle to display something ๐Ÿ‘€

@ayamflow I promise you I don't see anything ๐Ÿ˜‚ maybe onwheel doesn't capture the trackpad, but only mousewheel ...
or I just throw this specific laptop out of the window ...

makc commented

@jankohlbach

Basically, if I'm in Firefox and using a trackpad, the scrolling is way too fast.

I think it is because this lib assumes the firefox is slow, and it isn't ยฏ\_(ใƒ„)_/ยฏ

firefoxMultiplier: Firefox on Windows needs a boost, since scrolling is very slow. Defaults to 15.

and here I am, scrolling locomotive demo in firefox on windows to the bottom in a split-second :')

@ayamflow,

where isTrackpad comes from the above stackoverflow link

for me those snippets just do not detect a touchpad at all. they probably work on authors hardware only.

makc commented

ah no, I take it back - not a firefox issue for me, locomotive demo scrolls super-fast in chromium as well