English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
innerHeightA read-only property that returns the height of the window content area (viewport) including the scroll bar.
UsedouterHeightProperty to get the entire height of the browser window.
window.innerHeight
var h = window.innerHeight; var w = window.innerWidth;Test and see‹/›
The numbers in the table specify the first browser version that fully supports the innerHeight property:
Property | |||||
innerHeight | 1 | 1 | 9 | 3 | 9 |
Return value: | A number representing the internal height of the browser window content area in pixels. |
---|
Display height and width using onresize event:
<body onresize="myFunc()"> <script> function myFunc() { var w = window.innerWidth; var h = window.innerHeight; document.getElementById("para").innerHTML = "Width: " + w + "<br>Height: " + h; } </script>Test and see‹/›
Cross-browser solution (for IE8and earlier versions used clientWidth and clientHeight):
var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; var w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;Test and see‹/›
This example shows innerWidth, innerHeight, outerWidth, and outerHeight in one example:
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>"; document.write(txt);Test and see‹/›
Reference: Window (Window)window.innerWidth property
Reference: Window (Window)window.outerHeight property
Reference: Window (Window)window.outerWidth property