francoischalifour / medium-zoom

🔎🖼 A JavaScript library for zooming images like Medium
https://medium-zoom.francoischalifour.com
MIT License
3.64k stars 165 forks source link

[Firefox] Not working with a responsive and lazy loaded image #157

Closed alanpoulain closed 4 years ago

alanpoulain commented 4 years ago

Bug description

In Firefox, when clicking on an image with a srcset attribute and a loading attribute set to lazy, the overlay loads but the image stays the same.

The overlay cannot be closed because the isAnimating variable is true.

It's because of these lines: https://github.com/francoischalifour/medium-zoom/blob/d5f45c58a219e5dcbc546d8ba2fbfc883ec6df3e/src/medium-zoom.js#L378-L385

Removing the sizes attribute does fire the load event in Chrome, but not in Firefox.

Reproducible example

Link to the bug reproduction

Environment

alanpoulain commented 4 years ago

I've opened a PR to fix this issue. Please also note this is the default configuration for gatsby-remark-images.