How can I preload these images?

[Azazel24]

I have some Javascript (.js attached as .txt) that works onMouseOver of an image both makes it shine and fades in another image at a different location on the screen.

Here is how I am calling it:

<img id="1" src="images/about.jpg" class="gradualshine" onMouseover="h('1','d'); d(450,245,'images/about_desc.jpg',500,35)" onMouseout="l('1'); l0('d')" alt="" border="0" width="171" height="162">

("d" is a div object that is not visible until this script activates it)

This is being used on http://www.tccommerce.com.

What I need to do is preload six images. What's happening is that the menu graphics load, then the user is moving the mouse over each one, but there is often a delay while the browser downloads "about_desc.jpg" and the images that correspond to the other menu options.

I need to tweak this script to preload these images so it is seamless. Any help is greatly appreciated.

[Kailash Badu]

use the Image Object.

[Azazel24]

Can you show me the usage? I apologize, I don't know anything at all about Javascript. I hired someone to do that code for me.

[Azazel24]

OK, I have tried using the image object to preload and it's not working.

I've inserted the following in my header:

<SCRIPT LANGUAGE = JAVASCRIPT>
if (document.images)
{
about1 = new Image();
about2 = new Image();
about3 = new Image();
about4 = new Image();
about5 = new Image();
about6 = new Image();

about1.src = "images/about_desc.jpg";
about2.src = "images/about_www.jpg"
about3.src = "images/about_ecommerce.jpg";
about4.src = "images/about_seo.jpg"
about5.src = "images/about_data.jpg";
about6.src = "images/about_design.jpg"

}
</SCRIPT>


This is an example of me calling one of the images from the body:

<img id="i1" src="images/about.jpg" class="gradualshine" onMouseover="h('i1','d'); d(450,245,'images/about_desc.jpg',500,35)" onMouseout="l('i1'); l0('d')" alt="" border="0" width="171" height="162">

.... where 'd' is a div object to which I pass the X and Y location, the image name, and image size.

Though I am preloading images/about_desc.jpg, when I call it from the onMouseOver function here, it isn't preloaded.

Any help is appreciated.

[Azazel24]

*bump*