Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Getting browser Zoom level
//for zoom detection
px_ratio = window.devicePixelRatio || window.screen.availWidth / document.documentElement.clientWidth;
function isZooming(){
var newPx_ratio = window.devicePixelRatio || window.screen.availWidth / document.documentElement.clientWidth;
if(newPx_ratio != px_ratio){
px_ratio = newPx_ratio;
return true;
console.log("just resizing");
return false;
Copy link

QualityRank commented Jul 21, 2021

Excellent. Thank you for this!

Copy link

RemcoSmitsDev commented Dec 2, 2021

This is not working with an 4k iMac. When you have normal zoom level(100%) it will show up as 200%. Any ideas to wrap around this problem?

Copy link

abilogos commented Dec 22, 2021

@RemcoSmitsDev : sorry to hear that, the script I have wrote is just detecting zooming and not the percentage.
one thing i want to mention that it is based on the css px which is different from pixels.
I have got a 4k monitor and I had set everything to scale 200% in order to show everything bigger.
maybe this could be the reason why you get 200%.
lets check your screen resolution here and see if it reports 1080p 0r 4k ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment