MetinArslanturk/react-animation-on-scroll

Add support for compatibility with OverlayScrollbars?

Opened this issue · 1 comments

I'm using OverlayScrollbars (https://www.npmjs.com/package/overlayscrollbars-react) within my project to replace the scrollbar with an overlay rather than relying on the browser's built in scrollbars to prevent the page content 'shifting' when moving between pages that do/do not have overflow content.

Unfortunately, I assume due to how OverlayScrollbar works, it prevents this module from working. I have tested within Chrome Dev Tools that when I remove the classes applied to <html> and <body> etc by OverlayScrollbars, and remove overflow: hidden from ths styling, it returns the browser's normal scrollbar, and this module then works perfectly.

With OverlayScrollbars enabled, any items that load within the viewport shown when the page first loads (i.e. the top of the page before you do any scrolling), work perfectly and animate in - however when you scroll down, none of the other components detect the viewport change and animate in, and the first component doesn't animate out (again, I assume it can't detect the viewport change).

Do you think you'd be able to build in compatability with OverlayScrollbars at all? Your module is about the only actively maintained Animation On Scroll I can find for React, and I'd love to be able to use it!

Thanks :)

Hi, Can you share a dummy example project which uses overlayscrollbars + react-animation-library. Then I can check for compatibility issues. Or better, If you detect the main problem / have suggestions I am definetely open for contributions.