Window outerWidth
and outerHeight
Properties
Definition and Usage
The outerHeight
property sets or returns the outer height of a window, including all interface elements (such as toolbars/scroll bars).
The outerWidth
property sets or returns the outer width of a window, including all interface elements (such as toolbars/scroll bars).
outerWidth
and outerHeight
are read-only properties.
Note: Use the innerWidth and innerHeight properties to get the window height and width excluding toolbars and scroll bars.
Syntax
To get the width and height of the window:
window.outerWidth
window.outerHeight
To set the width and height of the window:
window.outerWidth=pixels
window.outerHeight=pixels
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
Property | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
outerWidth | 1.0 | 9.0 | 1.0 | 3.0 | 9.0 |
outerHeight | 1.0 | 9.0 | 1.0 | 3.0 | 9.0 |
Example
To get the width and height of the window (including toolbars/scroll bars):
var w = window.outerWidth;
var h = window.outerHeight;
The following demonstrates the use of innerWidth
, innerHeight
, outerWidth
, and outerHeight
:
var txt = "";
txt += "<p>innerWidth: " + window.innerWidth + "</p>";
txt += "<p>innerHeight: " + window.innerHeight + "</p>";
txt += "<p>outerWidth: " + window.outerWidth + "</p>";
txt += "<p>outerHeight: " + window.outerHeight + "</p>";