zoom.js
zoom.js copied to clipboard
Blurring in desktop Chrome browsers
Is there a way to prevent the blurring that seems to occur in Chrome & Chromium-based browsers after the image has finished zooming? No issue with Firefox.
Not a big deal with most pictures, but for things like desktop screenshots with text, it becomes a bit hard to read.
I would also like to know about this. Similarly blurred for Safari.
seems works for me:
.zoom-overlay-open, .zoom-overlay-transitioning { cursor: default; image-rendering: -webkit-optimize-contrast; -ms-interpolation-mode: nearest-neighbor; }
https://developer.mozilla.org/en-US/docs/Web/CSS/image-rendering
Had you try with an high quality image?
Strangely enough, image-rendering: pixelated
worked for me after the zoom transition. Doesn't look that great on anything else, but it definitely made the zoomed version of the image look much better and less blurry (in Chrome, at least.)
This plugin is no longer maintained. I've pushed a fix in my vanilla JS fork - perhaps you'd like to take a look there (sorry for the shameless plug 😅) or at some of the other forks such as this one.