search

jackmoore / zoom

jQuery plugin for zooming images on mouseover.
http://www.jacklmoore.com/zoom/
MIT License
1.54k stars 459 forks source link

Optional preloading #25

Open RS71 opened 11 years ago

RS71 commented 11 years ago

Would be nice to have a setting to postpone the loading of the image until the zoom trigger is activated.

adamfratino commented 10 years ago

This would be a great feature.

petcarerx commented 2 years ago

We achieved the deferred loading of the zoom image by doing the following (for mouseover trigger setting , Zoom 1.7.21 ):

Change the img.onload to a named function:

img.onload = function () { to function zoomImgLoaded() {

replace img.src = settings.url

with

$source.one('mouseenter touchstart', (evt) => {                
                img.onload = zoomImgLoaded.bind(evt);
                img.src = settings.url;
   );

and lastly add start(this) to the end of zoomImgLoaded

We need to maintain the order of events (image load event, mouseenter, mousemoves), and that means holding onto the mouseenter event so we can pass it to the start function after we run the init function, since .on('mouseenter.zoom', start) will be skipped.