Programming Tips - javaScript: get the size of the current window I am in

Date: 2009apr23 Language: javaScript Q. javaScript: get the size of the current window I am in A. Its not as simple as you might expect. Here is a function called getWindowDim() with returns the width and height of the current window. Its helper functions proceeed it and there is a function that uses it called center() after it. Can you can paste the following into and html page and try it out.
<div id=box style="position: absolute; border: thick solid #ccc; background-color: #ddd;">Hello</div> <script> function getScrollXY() { let scrOfX = 0, scrOfY = 0; if (typeof(window.pageYOffset) == 'number') { // Netscape compliant scrOfX = window.pageXOffset; scrOfY = window.pageYOffset; } else if (document.body && ( document.body.scrollLeft || document.body.scrollTop)) { // DOM compliant scrOfX = document.body.scrollLeft; scrOfY = document.body.scrollTop; } else if (document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop)) { // IE6 standards compliant mode scrOfX = document.documentElement.scrollLeft; scrOfY = document.documentElement.scrollTop; } return [scrOfX, scrOfY]; } function getSimpleWindowDim() { let width, height; if (window.innerWidth) { width = window.innerWidth; height = window.innerHeight; } else if (document.documentElement && document.documentElement.clientWidth) { width = document.documentElement.clientWidth; height = document.documentElement.clientHeight; } else if (document.body) { width = document.body.clientWidth; height = document.body.clientHeight; } return [width, height]; } function getWindowDim() { const dim = getSimpleWindowDim(); const scr = getScrollXY(); return [dim[0] + scr[0], dim[1] + scr[1]]; } function center(obj) { if (obj == null) return false; const dim = getWindowDim(); const width = dim[0]; const height = dim[1]; obj.style.top = height / 4; obj.style.left = width / 4; obj.style.width = width / 2; obj.style.height = height / 2; return true; } function exampleUse() { const obj = document.getElementById('box'); center(obj); obj.innerHTML = 'Width=' + obj.style.width + '<br>Height=' + obj.style.height; } exampleUse(); </script>