How do I preload images using JavaScript?

Question

I'm using this code in my header:
image1 = new Image();
image1.src = "buttonover1.gif";

This is what they show all over the Internet, and it's also what I learned in school. Why is this not working? Anyone have other code that could help me? Thanks.

Just so you know, this is not the path to my image. I changed it for the sake of simplicity. I have these in an external images folder, and I state the proper path. Still, they don't preload. When I mouse over my images, it takes a second to display it (meaning it hasn't preloaded).

Answer 1

You would preload the mages using javascript. Examples on these sites:

http://javascript.internet.com/miscellaneous/preload-images.html
http://builder.com.com/5100-6371-5214317.html

The preloader code goes into the area as that code will always be excuted before the is rendered.

Answer 2

That code tells me that the image is in the same place as the html.
The norm is to put the images in the images folder.

So where do you store our images?

Answer 3

Your code is correct and should work fine... The path should the exact path of your image, and you can use it now... here is the code:

< img src ="..." onMouseOver=" this.src='buttonover1.gif' ">

Answer 4