I want to use Javascript to prevent absolutely positioned items from overlapping if the window too small. I adapted the following script from other pages on the web that approximated what I want to accomplish:

Code:
function fnPCL() {
	var iContentHeight, iAvailableHeight;
	
	eCopyright.style.position = "static";
	iContentHeight = document.body.scrollHeight;
	iAvailableHeight = document.body.offsetHeight;

	if(iContentHeight <= (iAvailableHeight - 25)){
		eCopyright.style.position = "absolute";
		eCopyright.style.top = "auto";
		eCopyright.style.bottom = "0px";
	}else{
		eCopyright.style.position = "static";
	}
	eCopyright.style.display = "block"
	window.status = "contentHeight=" + iContentHeight + ", AvailableHeight=" + iAvailableHeight + ", position=" + eCopyright.style.position
}
Here is a demo page that I made for the script (works in Internet Explorer). If the window is large enough the the text will be placed at the bottom of the page. Otherwise it will placed inline with the document. Try resizing the page so that it's both a very small window and a very large one to see how it works.

The problem that I'm having is that the script doesn't always work. At times it appears to be getting an incorrect (too large) value for the height of the cotnent and as such the text at the bottom isn't absolutely positioned the way it should be. Additionally, my script doesn't work on Netscape6. Any suggestions about imporving this script. Or if you know of a working example of what I'm trying to do, please point me to it.

Cheers!