JavaScript Window Utility

These functions return the browser's window dimensions/offset/center. windowCenter() returns an object with the x and y coordinants to use to center an absolutely positioned HTML element.

// window.js
function windowOffset(){
	var offX = 0;
	var offY = 0;
	if(window.pageYOffset){
		offX = window.pageXOffset;
		offY = window.pageYOffset;
	}
	else{
		if(document.documentElement.scrollTop == 0){
			offX = document.body.scrollLeft;
			offY = document.body.scrollTop;
		}
		else{
			offX = document.documentElement.scrollLeft;
			offY = document.documentElement.scrollTop;
		}
	}
	return{x:offX,y:offY};
}
function windowSize(){
	var wid = 0;
	var hei = 0;
	if(window.innerWidth){
		wid = window.innerWidth;
		hei = window.innerHeight;
	}
	else{
		if(document.documentElement.clientWidth == 0){
			wid = document.body.clientWidth;
			hei = document.body.clientHeight;
		}
		else{
			wid = document.documentElement.clientWidth;
			hei = document.documentElement.clientHeight;
		}
	}
	return{width:wid,height:hei};
}
function windowCenter(object){
	var object_width = parseInt(object.style.width);
	var object_height = parseInt(object.style.height); 
	var off = windowOffset();
	var siz = windowSize();
	return{x:parseInt(((siz.width-object_width)/2)+off.x),y:parseInt(((siz.height-object_height)/2)+off.y)};
}

Example usage:

<html>
	<head><title></title>
<script type="text/javascript" src="window.js"></script>
<script type="text/javascript">
	window.onload = function () {
		var obj = document.getElementById("divToPosition");
		var center = windowCenter(obj);
		obj.style.left = center.x + "px";
		obj.style.top = center.y + "px";
	};
</script>
	</head>
<body>
	<div id="divToPosition" style="position:absolute;width:100px;height:100px;background:#f00;"></div>
</body>
</html>

Contact