Get the viewable area in the browser window in JavaScript

Tip: You can modify some of the code before running

<style type= "Text/css" > body {height:100%; margin:0; padding:0; } #warp {Position:absolute; top:0; left:0; Background: #059B9A; z-index:100; Filter:alpha (OPACITY=50); /* IE */-moz-opacity:0.5; /* Moz + FF * * * opacity:0.5; } </style> <script type= "Text/javascript" > Function Getviewportinfo () {var w = (window.innerwidth)? window . Innerwidth: (document.documentelement && document.documentElement.clientWidth)? Document.documentElement.clientWidth:document.body.offsetWidth; var h = (window.innerheight)? Window.innerheight: (document.documentelement && document.documentElement.clientHeight)? Document.documentElement.clientHeight:document.body.offsetHeight; return {w:w,h:h}; }; function Setel () {var info = getviewportinfo (); var el = document.getElementById (' warp '); El.style.height = info.h + ' px '; El.style.width = info.w + ' px '; } window.onload = function () {Setel ();} window.onresize = function () {Setel ();} </script> <div id= "warp" onclick= "document.getElementById" (' Warp '). style.display= ' None ' "></div> <div > If you see a semi-transparent layer, and the window does not appear with scrollbars, the example works fine. <br/> Click to close the transparent layer. </div></td> </tr> </table>

Tip: You can modify some of the code before running