pre-loading images (script?)

  • Thread starter Thread starter VR
  • Start date Start date
V

VR

Hi,

I am trying to have a menu item (which is an HTML img) to
change as a mouse moves over it. So, my code looks
something like this:

<a
onmouseover="ActivateImage('MyImage');"
onmouseout="InactivateImage('MyImage');"
href="javascript:void(FollowLink('MyImage'));">
<IMG height="22" src="Image1.gif" name="MyImage">
</a>

<script>
function ActivateImage(ImageName)
{
document.images(ImageName).src = "Image2.gif"
}

function InactivateImage(ImageName)
{
document.images(ImageName).src = "Image1.gif"
}
</script>


I have about 20 images setup in the similar way on my
page.

The problem is that when the page is loading, it seems
that only the images that are specified in my HTML are
loaded. The other images start loading as I move mouse
over original images. So, since it takes a whlie for those
alternate images to load, the very first time I move mouse
over an image and then quickly move it away the switch
doesn't happen.

Is there any way to make sure that my alternate images get
loaded with my page right away? Or should I use a
different approach all together?

Thanks a lot for any help.

VR
 
You need to use javascript for this, I personally use Macromedia Dreamweaver
to set this kind of thing up
Try a search on google for "preloading images"
 
You need to use JavaScript to preload the images. However, preloading
images is sometimes ignored if a user has changed their browser's settings.
The safest way to do this, is to load all the images into two or more
layers, and then show/hide the layers accordingly.

Mun
 
Thanks.

VR

Joe Gass said:
You need to use javascript for this, I personally use Macromedia Dreamweaver
to set this kind of thing up
Try a search on google for "preloading images"
Click to expand...
 
Back
Top