KingSora / OverlayScrollbars

A javascript scrollbar plugin that hides the native scrollbars, provides custom styleable overlay scrollbars, and preserves the native functionality and feel.
https://kingsora.github.io/OverlayScrollbars
MIT License
3.78k stars 214 forks source link

My page is using virtual scrolling, but it seems like the browser's native scrollbar is not being hidden. #526

Closed coderwx1 closed 1 year ago

coderwx1 commented 1 year ago

Examples Here's an example of my code,thx u https://codesandbox.io/s/gracious-sea-2p8djp?file=/src/App.vue

KingSora commented 1 year ago

Good day @coderwx1

The problem here is that the RecycleScroller component is overwriting class names from the viewport element. Thus the correct stylings aren't applied.

You can just remove the part where you set the .scroller element as the viewport element and it should just work: https://codesandbox.io/s/headless-frog-43zm67?file=/src/App.vue

coderwx1 commented 1 year ago

Good day @coderwx1

The problem here is that the RecycleScroller component is overwriting class names from the viewport element. Thus the correct stylings aren't applied.

You can just remove the part where you set the .scroller element as the viewport element and it should just work: https://codesandbox.io/s/headless-frog-43zm67?file=/src/App.vue

Thank you for your response. While this approach can indeed hide the native scrollbar. But,Due to the requirement of the virtual scrolling library, a size must be set for '.scroller'. However, after setting the size for '.scroller', the native scroll bar in the browser reappears. This is because the 'overflow-y: auto' CSS property for virtual scrolling overrides the OS CSS. Can you provide me some advice in this situation? Thank you。 image

KingSora commented 1 year ago

@coderwx1 v2.2.0 just released which should make your initial example work as well. Here is your initial example just with overlayscrollbars v2.2.0: https://codesandbox.io/s/nervous-ardinghelli-fgxqbh?file=/src/App.vue

coderwx1 commented 1 year ago

@coderwx1 v2.2.0 just released which should make your initial example work as well. Here is your initial example just with overlayscrollbars v2.2.0: https://codesandbox.io/s/nervous-ardinghelli-fgxqbh?file=/src/App.vue

Thank you. I have imported the latest released version and everything is working smoothly.