12

I want to detect if the browser is zoomed in or out (don't really care to know the value, but I assume it will need to be found anyway in the decision process). I have read a lot of other SO posts on the topic, but none of the solutions given work on FF (although there is an IE7/8 and chrome solution).

Oh, and I can't use flash, so the flash solution is out of the question.

Edit: And I must be able to detect this on the initial page load

Joda Maki
  • 5,649
  • 6
  • 27
  • 36
  • 2
    I don't think a solution exists which fulfills all your requirements. I would *love* to be proven wrong. – thirtydot Feb 14 '11 at 14:42
  • 9
    Whether zoom has been applied or not is frankly none of your business. – reisio Feb 14 '11 at 16:16
  • Can you explain why you need this? Maybe there are alternative solutions... – RoToRa Feb 14 '11 at 16:29
  • my layout barfs on zoom. I am not exactly sure why, but if it is something other than a trivial fix, it would cost too much to make it work with zooming. I outlined details of my problem a bit in another question http://stackoverflow.com/questions/4988710/browser-zooming-misaligned-workaround – Joda Maki Feb 14 '11 at 16:51
  • 1
    A lot of layouts barf on zoom. Especially where you have floats with pixel-perfect alignment. But it's very much a browser-specific thing; you'll get different effects in different browsers, so even if you could detect the zoom, you'd also need to detect which browser it was, and which version, and what level of zoom, and compensate differently for every possible combination. Probably not feasible. – Spudley Feb 14 '11 at 17:27
  • Have you tried comparing JavaScript viewport and screen values to see if they match? But even if you do figure this out, what will you do? You don't want to/can't adjust their zoom level--they may need it for accessibility. You should fix your layout so it does work zoomed in. CSS overflow:visible or overflow:hidden can help a lot. – Jon Adams Feb 26 '11 at 17:08
  • 1
    I found a solution for FF4 and FF3.5 but no other versions of Firefox. See http://stackoverflow.com/questions/1713771/how-to-detect-page-zoom-level-in-all-modern-browsers/5078596#5078596 – yonran Apr 14 '11 at 00:06
  • 1
    @reisio: If every browser implemented zoom properly without breaking layouts, then yes, it would be none of our business. But that just isn't always the case. And, a sidenote, a lot of these solutions fail when zoom level has been previously changed, where scripts on new page load or refresh typically cannot detect the non-default zoom setting. – Adam Eberlin Oct 09 '11 at 10:03

5 Answers5

7

With modern versions of FireFox, you can now do the following:

DPR = window.devicePixelRatio;
if ( DPR <= 0.999 || DPR >= 1.001 ){
   // User has zoomed in or zoomed out
}
Brian Webster
  • 30,033
  • 48
  • 152
  • 225
2

If by zoom you mean that the user pressed ctrl/cmd+[plus] and not css transformation you can detect computed font-size. Just checked in FF 4.0.1/Mac and it worked for me. To detect computed font-size I used code from this question: Get computed font size for DOM element in JS .

The value changed after zooming. You need to know what the font-size of a certain element should be (as set in css) and compare it with what it really is.

Community
  • 1
  • 1
Litek
  • 4,888
  • 1
  • 24
  • 28
1

I suggest you look at this generic question. And possibly close your own as a duplicate (not voting to do this myself, since it's not "an exact dup".

Community
  • 1
  • 1
ripper234
  • 222,824
  • 274
  • 634
  • 905
0

Did you try to detect the resolution, which may help you to detect the zoom.

AjayR
  • 4,169
  • 4
  • 44
  • 78
0

Maybe instead of detecting the zoom you could detect the error.

For example if your layout expects an elements' offset to be at 100,200 and a query shows it's at 300,450 you'll know it's in the wrong place and you can apply your fixup/workaround.

This has the added benefit that if the zoom issue is fixed in a future version of the browser you won't be applying your fix needlessly or incorrectly.

SpliFF
  • 38,186
  • 16
  • 91
  • 120