Topic awaiting preservation: Getting Image Dimensions in Javascript

In IE I can load an image with

var img1 = new Image();

img1.src = 'somepic.jpg'

I can get its width and height using

img1.width

and

img1.height

I can do this without referencing these dimensions anywhere else in the document. IE loads the image and gets it dimensions from the image itself. This should work in Opera and Netscape 4.x as well but it doesn't. What am I doing wrong?

what is happening w/ you with NS or Opera then?
wrong values? syntax errors ?

Netscape will return 'undefined' for either img1.height or img1.width unless the script that tries to access these properties is run after img1 is loaded in the body of the page. Opera just returns '0' irregardless. In IE the image is referenced nowhere in the document except in script yet IE is able to load the image and retrieve its dimensions.

What I'm trying to do is create a page that displays a random background upon every load. These backgrounds are large. They all have a width of 800px and heights ranging from 480px to 2000px. I want to fill the entire page background with these images without the images being cropped or tiled and with no visible borders or side scrolling. My page content will all reside in hidden layers accessed via a menu at the top of the page. (By the way this will be my browser start page. It will only be loaded locally so bandwidth isn't an issue.)

In IE I use a script within the body of the page to set the background to the randomly chosen image and I use the height property of the image to set the height of a positioned div element so that the background isn't cropped. I use "overflow-x : hidden;" in a style sheet for the body tag to prevent side scrolling.

document.body.style.backgroundImage = ("url(" + img1.src +")");

nocrop.style.height = img1.height;

The page I've created for IE6 works flawlessly but the methods used simply don't work for the other browsers. In the other browsers I basically have to load the image twice to be able to get at it's height property. In Netscape 4.61 I can avoid the need to get the image height by placing the image within a 1x1 positioned table and it yeilds the appearance I want. It works in Opera too but I don't know how to eliminate the side scrolling. In Netscape I use this

<TABLE CELLPADDING="0" CELLSPACING="0" STYLE="position: absolute; left: 0; top: 0; z-index: 1;">

<TR><TD><IMG NAME="img1" SRC="&{img1.src};" WIDTH="796"></TD></TR></TABLE>

Like I said, this works but it feels like cheating. I'd rather not do it this way.

I hope you guys can drill some insight into my head!