Skip to content

Instantly share code, notes, and snippets.

@scottjehl
Created March 16, 2012 19:25
Show Gist options
  • Save scottjehl/2051999 to your computer and use it in GitHub Desktop.
Save scottjehl/2051999 to your computer and use it in GitHub Desktop.
Reliably get viewport dimensions in JS
/*!
An experiment in getting accurate visible viewport dimensions across devices
(c) 2012 Scott Jehl.
MIT/GPLv2 Licence
*/
function viewportSize(){
var test = document.createElement( "div" );
test.style.cssText = "position: fixed;top: 0;left: 0;bottom: 0;right: 0;";
document.documentElement.insertBefore( test, document.documentElement.firstChild );
var dims = { width: test.offsetWidth, height: test.offsetHeight };
document.documentElement.removeChild( test );
return dims;
}
// Notes:
// relies on position:fixed support, but it should work in browsers that partially support position: fixed like iOS4 and such...
//sample usage: var viewportwidth = viewportSize().width;
@Pistil-Studio
Copy link

thx a lot.
You saved a couple of my hours

@rabeesh
Copy link

rabeesh commented Mar 25, 2016

@francosalcedo
Copy link

THANKS!

@kinseymarie74
Copy link

It is now 7 years after you first posted this, and this weekend I found myself needing this functionality. I have been all over Stackoverflow and a whole pile of other sites, googling like crazy. The question has been asked a zillion times and there are ten zillion answers out there - and NONE of them work. At least not in Firefox 67.0.4. None, that is, except for yours. Thank you thank you thank you!

@mzibari
Copy link

mzibari commented Mar 14, 2020

This is FANTASTIC!!!

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