BetterTyped/react-zoom-pan-pinch

Scrollbar thumb moves to inconvenient position when zooming

ShashanKV98 opened this issue · 1 comments

Describe the bug

When using the library on a div element that has scrollbars, the position of the scrollbar thumb at a higher zoom level hinders viewing the whole element.

To Reproduce
Steps to reproduce the behavior:

  1. Go to the following sandbox link

https://codesandbox.io/s/recursing-cherry-n7jn8r?file=/src/App.js

  1. Scroll down to the middle of the element and zoom. You'll notice that the vertical scrollbar thumb shortens but also moves up, which is inconvenient since you can't really view the text at the top of div at that zoom level. The same happens to the horizontal scroll bar. It'd be great if there's a way to position the thumb at the same scroll position when zooming in, so that we could navigate the whole element.

I've tinkered with TransformWrapper functions, but no modification seems to change the default behavior. Any ideas or suggestions regarding this would be helpful !

Hi @prc5 I tried a few different methods to adjust the scrollbar while zooming, but couldn't come up with anything useful. Can you please suggest a way to solve this issue?