views:

472

answers:

1

How do I use jQuery to determine the size of the browser viewport, and to redetect this if the page is resized? I need to make an IFRAME size into this space (coming in a little on each margin).

For those who don't know, the browser viewport is not the size of the document/page. It is the visible size of your window before the scroll.

+6  A: 

To get the width and height of the viewport:

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

resize event of the page:

$(window).resize(function() {

});
SimaWB
I tested this on Windows IE6, IE8, FF3.6.3, Google Chrome 5.0.375.70, Opera 10.53, and Safari 5.0 (7533.16). This works consistently on all of these. I also tested FF3.6.3 on Ubuntu and it works there too. I think I'm using jQuery 1.3 with WordPress 2.9.2, which is where I needed this to work.
Volomike