When I try to get the scroll speed of a user I get inconsistent results between mac and windows.
to reproduce
- Open this codesandbox
- With a mouse, scroll down 1 "tick" (use a mouse that doesn't have smooth scroll)
problem
Using the exact same hardware (mouse / monitor) and browser (chrome):
- on Windows I get a value of 125
- on Mac I get a value of around 12
I need a way to know how fast the user scrolled that gives comparable results for all operating systems.
more context
- This is for a "infinite canvas" type application (like tldraw). I would like to "zoom out" when the user scrolls backwards and "zoom in" when the user scrolls in.
- I want to use the scroll speed (and not just the scroll direction) because otherwise it feels clunky
- I know that it's possible because figma can zoom in/out based on mouse wheel speed. Though they use webgl so not sure if they have access to properties that the normal wheel event doesn't have
- I can't simply check if deltaY is > 100 because on mac deltaY can get over 100 when the user scrolls fast
- I tried every solution from this question. None of them worked across mac/windows
