4

Is it possible to detect the browser zoom level when the user changed the zoom level of browser, and the default zoom level using javascript. I need to call different xml files according to the zoom level change.

josliber
  • 43,891
  • 12
  • 98
  • 133
Sakeer
  • 77
  • 1
  • 1
  • 4
  • 4
    -1: Don't repost the same question just because you don't like the original answer. – zzzzBov Nov 09 '10 at 05:04
  • 1
    Especially when the original answer was perfectly valid. – Christian Mann Nov 09 '10 at 05:05
  • Does this answer your question? [How to detect page zoom level in all modern browsers?](https://stackoverflow.com/questions/1713771/how-to-detect-page-zoom-level-in-all-modern-browsers) – gre_gor Jun 02 '23 at 15:20

2 Answers2

6

I found that you have to vary for each browser:

This works great in safari and chrome:

zoom = parseInt(document.defaultView.getComputedStyle(document.documentElement, null).width,10)/document.documentElement.clientWidth

This works well in IE8+ (unless your user has some freakish screen....):

zoom = window.screen.deviceXDPI/96

And for Firefox and IE7 I use this although I still haven't got it to work with Firefox on the Mac...

Good luck.

Josh
  • 10,961
  • 11
  • 65
  • 108
tom
  • 85
  • 1
0

This will give the current zoom ratio relative to the initial zoom when the page was first loaded , if it was loaded with no zoom ( 100% ) then it will give you the real actual current zoom :

window.addEventListener('resize',()=>{
    var height = Math.max( body.scrollHeight, body.offsetHeight, 
      html.clientHeight, html.scrollHeight, html.offsetHeight );
      const ratio = ( height /  document.documentElement.clientHeight )
      if (!window.zc_)
      {
        window.zc_ = 100/ratio
      }
    const zoom = ratio* window.zc_
    console.log(
      zoom
      );
    })
Dhia Hassen
  • 508
  • 4
  • 20