How to get ScreenWidth and ScreenHeight using Javascript?

How to get ScreenWidth and ScreenHeight using Javascript?

Below are the properties which return screen width and screen height. It has two variation,

  • Inner Property
  • Outer Property

Inner property

Shows the inner width/height of a window’s content area.

  • window.innerWidth
  • window.innerHeight

Outer Property

Shows the outer width/height of a window including all elements like scroll bar.

  • window.outerWidth
  • window.outerHeight

Code to get the screen width/height properties:

<html>
<body>

<div id=”screenwidth”></div>

<script>
var text = “”;
text += “<p>InnerWidth: ” + window.innerWidth + “</p>”;
text += “<p>InnerHeight: ” + window.innerHeight + “</p>”;
text += “<p>OuterWidth: ” + window.outerWidth + “</p>”;
text += “<p>OuterHeight: ” + window.outerHeight + “</p>”;

document.getElementById(“screenwidth”).innerHTML = text;
</script>

</body>
</html>

Real time editor to run the code:

Hope this helps!!!

Thank you!!!