search

malaman / js-image-zoom

Image zoom on mouse hover for desktop browsers without external dependencies
http://malaman.github.io/js-image-zoom/example
MIT License
214 stars 37 forks source link

the best way to update the image #21

Closed badrshs closed 3 years ago

badrshs commented 4 years ago

Hey , I was trying to update the image by re-calling the method again var imageZoom = new ImageZoom(document.getElementById("img-container"), options); but seems like this solution is not good , any better way to do that please ?

malaman commented 4 years ago

Hi, check the Demo -> see "change image" button The code ist here: https://github.com/malaman/js-image-zoom/blob/master/example/index.html#L196 This is currently the only supported way.

relh commented 3 years ago

I saw this just closed, but incase it's useful to anyone, I did something slightly related that was tricky.

I made two image zooms on the same image and also wanted to be able to update the underlying picture. To get it to work I had to use the method of assigning the zoom to an existing div and then manually triggering the onMouseMove events for each of them.

You can see it halfway down the page here: https://relh.github.io/sun_site/ https://github.com/relh/sun_site/blob/main/index.html https://github.com/relh/sun_site/blob/main/main.js

Big thanks to malaman for this great tool!