How to find the inner height and inner width of a browser window in JavaScript?

JavascriptObject Oriented ProgrammingFront End Technology

Javascript window object simply represents the browser window. This method is supported by all browsers. To get the inner height and inner width this method has provided some properties such as window.innerHeight and window.innerwidth respectively. Using these properties, it is easy to find the height and width of a browser window. Let's discuss them individually.

Inner width

In the following example, using the property window.innerWidth, the inner width of the browser window is found out and the result is displayed in the output. It gives the result in pixels.

Example

Live Demo

<html>
<body>
<p id="width"></p>
<script>
   var w = window.innerWidth
   var x = document.getElementById("width");
   x.innerHTML = "Browser inner window width: " + w ;
</script>
</body>
</html>

Output

Browser inner window width: 598


Inner height

In the following example, using the property window.innerheight, the inner height of the browser window is found out and the result is displayed in the output. It gives the result in pixels.

Example

 Live Demo

<html>
<body>
<p id="height"></p>
<script>
   var h = window.innerHeight
   var x = document.getElementById("height");
   x.innerHTML = "Browser inner window height: " + h ;
</script>
</body>
</html>

Output

Browser inner window height: 477;
raja
Published on 18-Jul-2019 19:09:02
Advertisements