Javascript scrollHeight is returning the wrong height

[blackman890]

Hi there.

Currently I am encountering a slight problem with my javascript snippet, here's the code:

<script type="text/javascript"> 
	
	version=0
	if (navigator.appVersion.indexOf("MSIE")!=-1){
	temp=navigator.appVersion.split("MSIE")
	version=parseFloat(temp[1])
	}
	
	if (version>=7 || version==0) //NON IE browser will return 0
	{
		var myWidth = 0, myHeight = 0;
		if( typeof( window.innerWidth ) == 'number' ) {
			//Non-IE
			myWidth = window.innerWidth;
		} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
			//IE 6+ in 'standards compliant mode'
			myWidth = document.documentElement.clientWidth;
		} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
			//IE 4 compatible
			myWidth = document.body.clientWidth;
		}
		myHeight = document.body.scrollHeight;
		var i=0
		for (i=0;i<=50;i++)
		{
			document.write('<img class="snow" style="left:' + Math.round((myWidth - 60)*Math.random()) + 'px; top:' + Math.round((myHeight - 35)*Math.random()) + 'px;" src="web/images/snowflake.png">');
		}
		for (i=0;i<=100;i++)
		{
			document.write('<img class="snow" style="left:' + Math.round((myWidth - 60)*Math.random()) + 'px; top:' + Math.round((myHeight - 35)*Math.random()) + 'px;" width="23" height="26" src="web/images/snowflake.png">');
		}
		for (i=0;i<=150;i++)
		{
			document.write('<img class="snow" style=" left:' + Math.round((myWidth - 60)*Math.random()) + 'px; top:' + Math.round((myHeight - 35)*Math.random()) + 'px; " width="15" height="18" src="web/images/snowflake.png">');
		}
	}
	
</script>

The problem I am encountering is that on some sites, like http://kisildalur.is/?p=2&id=808 there is an extra space below the content while on other sites http://kisildalur.is/?p=1&id=8 there are none. This slight change of height is something beyond my understanding of this problem and I would like for a slight help to fix it.


P.S.
I know the code is brutal but it works


EDIT:
After some investigation I have found out that the problem might be due to the text in the information table being hidden once the document loads. This however might not occur before my script runs and therefore when my script runs, the whole text in the information table is pushing the content down.

Does anyone have any suggestion on how to work around this?

[blackman890]

It was as I thought.

The code was running before Tooltip.js but it's Tooltip.js that is hiding the text. When the code ran before it, the text inside the information table was not hidden and pushing the website content down.

All I had to do was to change this code into a function and register with the following method:

if (window.addEventListener) {
    window.addEventListener('load', functionName, false);
} else if (window.attachEvent) {
    window.attachEvent('onload', functionName);
}

That was all I needed to do