etto91 / react-scroll-wheel-handler Goto Github PK

Hi,

First of all thanks for this library, so far it's been a lifesaver. What i trying to solve is if I can add momentum scrolling using the mouse wheel or trackpad. So when the user uses are larger scroll move it will go faster and slowly loses speed afterwards. The same as regular osx trackpad scrolling works.

When using the default wheel event, it will trigger way too much events which will crash the browser. React scroll wheel fixes this, but we lose the ability to use some normalized momentum scrolling. Is this something you think is possible ? And is in the scope of this library?

I'm also looking at https://idiotwu.github.io/smooth-scrollbar/ , the problem there is that it will add transforms to scroll the container, but I'm only looking to handle the events and trigger my own up/down functions.

I've just tried this package, it works fine! good job.

I had to add to my file global.d.ts the string declare module 'react-scroll-wheel-handler';
would be fine if you add the @type module

Hi,

Thank you for this package, it works great en MacOS, but I recently noticed that it does not work on Windows. The wheel event does not fire up or down handler.

Any idea why ?

Thanks again

I implement the handler in an overflow hidden view and use scrolling handler to trigger animation change of component. I wrapped whole view with the handler component.

However, the handler is triggered not consistently, usually stopped working after first scroll action. Any idea on what's happening?

"Math.Sign()" used on line 198 and 211 is not supported by IE11.
Do you offer support for IE11? I am going to use react-scroll-wheel-handler on my plugin, but I am trying to making sure that is IE11 compatible.

Do you think you can make this IE11 Compatible? You could use a Polyfill or take a look here (https://stackoverflow.com/questions/7624920/number-sign-in-javascript)

Hi, thanks for the great package!

But leftHandler & rightHandler are somehow not working. I tried it in a Next.js project. Is it a problem in the package or in my implementation?

Check out example: https://github.com/superdotTech/react-scroll-wheel-handler

Best regards

Hi @Etto91 , great work on this helpful utility component.

I noticed that when using keyboard arrow keys, the event isn't returned and is only available when scrolling (refer to image)

first log was from scrolling
2nd one was from arrow keys

Also another thing to point out is that whenever I'm already focusing on components outside your utility (somewhere on the yellowed section) and pressing the arrow keys, the event still being fired when the expected behavior is shouldn't because I'm no longer focusing on the scrolling section (which is on the left section).

I checked the code and found the potential lines why it's happening, cloned it locally and it seems it's working as expected after doing the necessary changes. I tried submitting a PR but seems like I can't push my code into your repo under different branch name, haven't tried submitting PR before anyways.

Hello! is there a full example to how use a Custom Component ?
Thanks~

I tried this package. I used the prevent scroll attribute. It is working fine in desktop but when i am trying in my mobile I was able to scroll. It is not supported in mobile?

Passive events can not use e.preventDefault(). Browser throws a warning:

[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See

Hi,

I have noticed that the events from nested handlers are not reaching handlers above them. This should not be the default behaviour and the user should stop it intentionally via e.stopPropagation.

I have a use case where i want a nested handler to only handle scrolling down and scrolling up should be handled by the root handler. Is it possible to achieve this ?

This seems to be working well overall. Thanks!

However, it'd be good if I could decide whether I want the upHandler to only apply to scrolling and not to the up arrow key nor an 'up' swipe, for instance.

It's kind of breaking for me.

I guess this is a feature request.