FAQ Topic - How do I find the size of the window/browser canvas area?

[FAQ server]

-----------------------------------------------------------------------
FAQ Topic - How do I find the size of the window/browser
canvas area?
-----------------------------------------------------------------------

While it is often asked about window size, what is more relevant is
the "canvas area" of the browser.

Where supported in NN: (>NN4.0)

var winWidth = window.innerWidth;
var winHeight = window.innerHeight;

Where supported in IE: (>IE4.0)

var winWidth = document.body.clientWidth;
var winHeight = document.body.clientHeight;

When using IE6 with in CSS1Compat mode (i.e. with a Formal DOCTYPE):

var winWidth = document.documentElement.clientWidth
var winHeight = document.documentElement.clientHeight

Combined:

var winWidth, winHeight, d=document;
if (typeof window.innerWidth!='undefined') {
winWidth = window.innerWidth;
winHeight = window.innerHeight;
} else {
if (d.documentElement &&
typeof d.documentElement.clientWidth!='undefined' &&
d.documentElement.clientWidth!=0) {
winWidth = d.documentElement.clientWidth
winHeight = d.documentElement.clientHeight
} else {
if (d.body &&
typeof d.body.clientWidth!='undefined') {
winWidth = d.body.clientWidth
winHeight = d.body.clientHeight
}
}
}

Note: The dimensions can not be determined accurately until after the
document has finished loading.

http://msdn.microsoft.com/workshop/a...lientWidth.asp

http://docs.sun.com/source/816-6408-...ow.htm#1202446

http://msdn.microsoft.com/workshop/a.../measuring.asp
===
Postings such as this are automatically sent once a day. Their
goal is to answer repeated questions, and to offer the content to
the community for continuous evaluation/improvement. The complete
comp.lang.javascript FAQ is at http://jibbering.com/faq/index.html.
The FAQ workers are a group of volunteers.

[Randy Webb]

FAQ server said the following on 2/14/2007 7:00 PM:

-----------------------------------------------------------------------
FAQ Topic - How do I find the size of the window/browser
canvas area?
-----------------------------------------------------------------------

While it is often asked about window size, what is more relevant is
the "canvas area" of the browser.

Where supported in NN: (>NN4.0)

Shouldn't that just say "Where supported:" since >NN4.0 is far from
being the only place innerWidth and innerHeight is supported? The way
this entry is written it implies, to me, that you can only find the
dimensions in >NN4.0 or >IE4.0, which leaves any other browser out of
the picture which is far from being accurate.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/