3

If the browser have been zoomed in the images get blured. If I put a bigger image and set width/height to the desired size the image will be better in zoom, however in 100% some get moire, so I need some of the images to be different by the zoom level of the browser.

Is there any CSS keyword for a zoom alternative stylesheet or, zoom alternative image?

netmano
  • 322
  • 1
  • 13
  • “however in 100% some get moire” — I don’t quite understand what you mean by this bit. – Paul D. Waite Feb 22 '12 at 09:47
  • Your current approach is, as far as I know, the only way to make images look better when zoomed. It’s covered well here: http://www.webkit.org/blog/55/high-dpi-web-sites/. Sadly there’s not yet a CSS media query that detects the browser’s zoom level. – Paul D. Waite Feb 22 '12 at 09:51
  • 1
    I have a website, and an image on it. The image is let's say 125x125 pixel. I show it with if the browser's zoom level is '100%', the image will showed up in 100x100, so it's scaled down, and the moire happens there. – netmano Feb 22 '12 at 09:55
  • ah, like [moiré pattern](http://en.wikipedia.org/wiki/Moir%C3%A9_pattern) — gotcha, understood. – Paul D. Waite Feb 22 '12 at 10:00

1 Answers1

1

I don't believe there is a CSS keyword that handles browser zoom. You can use JavaScript to try to detect if the user has zoomed:

See answer: https://stackoverflow.com/a/995967/1145390

Community
  • 1
  • 1
ahdaniels
  • 1,050
  • 1
  • 12
  • 25