search

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.71k stars 215 forks source link

Scrollbar thumb jumping back to start position during window resize #598

Closed ryan-wheatley closed 7 months ago

ryan-wheatley commented 7 months ago

I've noticed that when having a dynamic <OverlayScrollbarsComponent> like

<OverlayScrollbarsComponent style={{ width: "100%", height: "100%" }}>

When the the component changes size, in or case due to a window resize, the thumbs of the scroll bars will flash bask to their start positions (left for x and top for y). When resizing stops they are in there correct position, but during the resize its very distracting.

Any idea if this could be something Im doing wrong? My setup is quite simple:

      <OverlayScrollbarsComponent style={{ width: "100%", height: "100%" }}>
         <div className={"flex h-full min-h-[500px] w-full min-w-[800px]"}/>
       </OverlayScrollbarsComponent >
KingSora commented 7 months ago

@ryan-wheatley I'm not observing this behavior.. are you able to provide a video? - Also what Browser and OS are you using?

KingSora commented 7 months ago

Here is a video of how resizing is looks on my system (tested in firefox + chrome newest versions). Also here is the example I've used: https://stackblitz.com/edit/overlayscrollbars-react-dh1dr1?file=src%2Findex.css,src%2FApp.tsx

https://github.com/KingSora/OverlayScrollbars/assets/12936317/a89a19aa-2bde-4388-bf72-618e1e248e1f

KingSora commented 7 months ago

@ryan-wheatley After further investigation I've identified the issue and will release a fix in the next release (which should be pretty soon)

KingSora commented 7 months ago

@ryan-wheatley I've published v2.4.6 which should fix the issue :)