laurenashpole/vue-inner-image-zoom

Handling wide, thin images

Closed this issue · 1 comments

I want to zoom on a wide but thin image (around 2000 x 500). The component works well, but I'd like to have the zoom height larger than the actual image size without zooming. In mobile this image looks very thin even at width: 100%.

Ideally the non-zoom-image would be in a container with a larger height, vertically centered, which would have top/bottom padding of course. When zoom is on, the entire container fills with the zoomed in image.

Any way to do that?

If I'm understanding correctly, I'm not sure if there's a good way to achieve what you want. The calculations for setting positions when you zoom in and move rely on the original and zoom images having the same aspect ratio and adding extra spacing to one would likely cause some odd edge cases when you pan to the edges.