JavaScript Window innerWidth and innerHeight Properties
The innerWidth property in JavaScript returns the width and innerHeight property returns the height of window content area.Â
Syntax:
window.innerWidth
window.innerHeight
Parameter: It doesn’t require any parameters.Â
Return Value: It returns a number(Representing the Width and Height of the window’s content area).Â
Note: For IE 8 i.e (Internet Edge 8) or earlier, use clientWidth and clientHeight to get the width and height of the window.Â
Example:Â In this example we retrieve and display the inner width and height of the browser window using JavaScript, showing the dimensions dynamically in a paragraph element.
html
<!DOCTYPE html>
< html >
< head >
< title >Browser Window</ title >
</ head >
< body >
< h2 >Browser Window</ h2 >
< p id = "demo" ></ p >
< script >
var Width, Height, result;
Width =
window.innerWidth ||
document.documentElement
.clientWidth ||
document.body.clientWidth;
Height =
window.innerHeight ||
document.documentElement
.clientHeight ||
document.body.clientHeight;
result =
document.getElementById("demo");
result.innerHTML =
"Browser inner width: " +
Width +
"< br >Browser inner height: " +
Height;
</ script >
</ body >
</ html >
|
Output:Â
Window innerWidth and innerHeight Properties Example Output
Last Updated :
12 Mar, 2024
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...