Getting the page and viewport dimensions using jQuery

Tue, Jun 8, 2010

Javascript, Programming, Snippets

thats why i Love jquery, cause everything is so simple…

To get the width and height of the whole page (document), use:

var pageWidth = $(document).width();
var pageHeight = $(document).height();

To get the width and height of the viewport (window), use:

var viewportWidth = $(window).width();
var viewportHeight = $(window).height();

Opera though has a different approach. with Opera 9.5 $(window).height() returns the document height (more info here)
you can get around this by using

var viewportHeight = window.innerHeight ? window.innerHeight : $(window).height();
, , ,

This post was written by:

- who has written 196 posts on

Software Engineer and Web Developer, keen on new technologies and has passion for web engineering.... Internet is my job and i love it...!!! Founded Baldpixel ( on 2008 which is specialized on enginnering custom web projects while cooperating with top advertising agencies on the net.

Contact the author