//get current dimensions and positions of basic objects (screen, browser, viewport, window/frame)
//optionally, specify a particular window/frame
//usage:   var dims = new WindowDimensions();
function WindowDimensions(windowFrame)
{
	windowFrame = windowFrame || window;
	
	//****************************************************//
	//***** screen, browser, and viewport dimensions *****//
	//****************************************************//
	
	this.screen = {
		width: screen.width,
		height: screen.height,
		//available screen dimensions; excludes taskbar, etc.
		availWidth: screen.availWidth,
		availHeight: screen.availHeight,
		colorDepth: screen.colorDepth
	};
	this.browser = {
		width: window.outerWidth,	//undefined in IE, incorrect in Opera
		height: window.outerHeight,	//undefined in IE, incorrect in Opera
		left: window.screenX,		//undefined in IE, incorrect in Opera
		top: window.screenY			//undefined in IE, incorrect in Opera
	};
	this.viewport = {
		outer: {	//includes scroll bars
			width: window.top.innerWidth,	//undefined in IE
			height: window.top.innerHeight	//undefined in IE
		},
		inner: {	//excludes scroll bars
			width: window.top.document.documentElement.clientWidth,
			height: window.top.document.documentElement.clientHeight
		}
	};
	
	//***********************************//
	//***** window/frame dimensions *****//
	//***********************************//
	
	var left, top;
	
	//scroll position of document
	if(!isNaN(windowFrame.pageYOffset))	//all except IE
	{
		left = windowFrame.pageXOffset;
		top = windowFrame.pageYOffset;
	}
	else	//IE
	{
		//IE quirks mode
		left = windowFrame.document.body.scrollLeft;
		top = windowFrame.document.body.scrollTop;
		
		//IE standards compliance mode
		if(windowFrame.document.documentElement && windowFrame.document.documentElement.scrollTop)
		{
			left = windowFrame.document.documentElement.scrollLeft;
			top = windowFrame.document.documentElement.scrollTop;
		}
	}
	left = left || 0;
	top = top || 0;
	
	this.window = this.frame = {
		outer: {	//includes scroll bars
			width: windowFrame.innerWidth,	//undefined in IE
			height: windowFrame.innerHeight	//undefined in IE
		},
		inner: {	//excludes scroll bars
			width: windowFrame.document.documentElement.clientWidth,
			height: windowFrame.document.documentElement.clientHeight	//incorrect in quirks mode (equals offsetHeight)
		},
		scroll: {
			width: windowFrame.document.documentElement.scrollWidth,
			height: windowFrame.document.documentElement.scrollHeight,
			left: left,
			top: top
		}
	};
}

//get current dimensions and positions of basic objects (screen, browser, viewport, window/frame)
//optionally, specify a particular window/frame
//usage:   var dims = new WindowDimensions();
function WindowDimensions(windowFrame)
{
	windowFrame = windowFrame || window;
	
	//****************************************************//
	//***** screen, browser, and viewport dimensions *****//
	//****************************************************//
	
	this.screen = {
		width: screen.width,
		height: screen.height,
		//available screen dimensions; excludes taskbar, etc.
		availWidth: screen.availWidth,
		availHeight: screen.availHeight,
		colorDepth: screen.colorDepth
	};
	this.browser = {
		width: window.outerWidth,	//undefined in IE, incorrect in Opera
		height: window.outerHeight,	//undefined in IE, incorrect in Opera
		left: window.screenX,		//undefined in IE, incorrect in Opera
		top: window.screenY			//undefined in IE, incorrect in Opera
	};
	this.viewport = {
		outer: {	//includes scroll bars
			width: window.top.innerWidth,	//undefined in IE
			height: window.top.innerHeight	//undefined in IE
		},
		inner: {	//excludes scroll bars
			width: window.top.document.documentElement.clientWidth,
			height: window.top.document.documentElement.clientHeight
		}
	};
	
	//***********************************//
	//***** window/frame dimensions *****//
	//***********************************//
	
	var left, top;
	
	//scroll position of document
	if(windowFrame.pageYOffset)	//all except IE
	{
		left = windowFrame.pageXOffset;
		top = windowFrame.pageYOffset;
	}
	else if(windowFrame.document.documentElement && !isNaN(windowFrame.document.documentElement.scrollTop))	//IE standards compliance mode
	{
		left = windowFrame.document.documentElement.scrollLeft;
		top = windowFrame.document.documentElement.scrollTop;
	}
	if(!top && !left)	//IE quirks mode
	{
		left = windowFrame.document.body.scrollLeft || 0;
		top = windowFrame.document.body.scrollTop || 0;
	}
	
	this.window = this.frame = {
		outer: {	//includes scroll bars
			width: windowFrame.innerWidth,	//undefined in IE
			height: windowFrame.innerHeight	//undefined in IE
		},
		inner: {	//excludes scroll bars
			width: windowFrame.document.documentElement.clientWidth,
			height: windowFrame.document.documentElement.clientHeight	//incorrect in quirks mode (equals offsetHeight)
		},
		scroll: {
			width: windowFrame.document.documentElement.scrollWidth,
			height: windowFrame.document.documentElement.scrollHeight,
			left: left,
			top: top
		}
	};
}

//get current dimensions and positions of basic objects (screen, browser, viewport, window/frame, document)
//optionally, specify a particular window/frame
//usage:   var dims = new WindowDimensions();
function WindowDimensions(windowFrame)
{
	windowFrame = windowFrame || window;
	
	//****************************************************//
	//***** screen, browser, and viewport dimensions *****//
	//****************************************************//
	
	this.screen = {
		width: screen.width,
		height: screen.height,
		//available screen dimensions; excludes taskbar, etc.
		availWidth: screen.availWidth,
		availHeight: screen.availHeight,
		colorDepth: screen.colorDepth
	};
	this.browser = {
		width: window.outerWidth,	//undefined in IE
		height: window.outerHeight,	//undefined in IE
		left: window.screenX,		//undefined in IE, incorrect in Opera
		top: window.screenY			//undefined in IE, incorrect in Opera
	};
	this.viewport = {
		//includes scroll bars
		width: window.top.innerWidth,	//undefined in IE
		height: window.top.innerHeight	//undefined in IE
	};
	
	//***********************************//
	//***** window/frame dimensions *****//
	//***********************************//
	
	//dimensions of window/frame (includes scrollbars)
	this.window = this.frame = {
		width: windowFrame.innerWidth,	//undefined in IE
		height: windowFrame.innerHeight	//undefined in IE
	};
	
	//*******************************//
	//***** document dimensions *****//
	//*******************************//
	
	var width, height, left, top;
	
	//dimensions of document (excludes scrollbars)
	if(windowFrame.document.documentElement && !isNaN(windowFrame.document.documentElement.clientWidth))
	{
		width = windowFrame.document.documentElement.clientWidth;
		height = windowFrame.document.documentElement.clientHeight;
	}
	else	//IE quirks mode
	{
		width = windowFrame.document.body.clientWidth;
		height = windowFrame.document.body.clientHeight;
	}
	
	//scroll position of document
	if(window.pageYOffset)	//all except IE
	{
		left = windowFrame.pageXOffset;
		top = windowFrame.pageYOffset;
	}
	else if(windowFrame.document.documentElement && !isNaN(windowFrame.document.documentElement.scrollTop))	//IE standards compliance mode
	{
		left = windowFrame.document.documentElement.scrollLeft;
		top = windowFrame.document.documentElement.scrollTop;
	}
	else	//IE quirks mode
	{
		left = windowFrame.document.body.scrollLeft;
		top = windowFrame.document.body.scrollTop;
	}
	
	this.document = {
		width: width,
		height: height,
		scroll: {
			left: left,
			top: top
		}
	};
}

Screen, Browser, and Window Dimensions

javascript, window, browser

JavaScript