Zoom feature with access to zoom value

[dellyn]

What's the best approach (How to add) zoom feature to the smooth scrollbar library?
I've been trying to implement this with transform: scale, but I have to calculate a huge chunk of data to get the right scale using transform: translate(), scale() and scrollTo() without animation

At the same time my scrollbar container width changes depending on the state of the application and it affects the position of the scrollbar content and scroll if I have zoom. Thank you in advance
#react

[idiotWu]

Zooming is quite a difficult feature that comes with a lot of re-calculations. The following link is an (inefficient) approach I tried in a recent project, implementing a scalable image viewer in keyframe refiner. You can drag&drop an image into it and zoom it with trackpads (or holding ctrl and scrolling the mouse wheel) to see how it behaves.

Source: keyframe-refiner/src/app/views/ImageViewer.svelte#L113-L146