onMouseOver

[rah111]

Hi all.

I found some code on the net which I have adjusted having created four images with Fireworks, and I am having a bit of a problem getting it to work properly.

The code is attached as a file called onMouseOver.htm in the zip file testfiles.zip. The images made the zip file too big to send.

When I browse the file using IE the images do not appear until I place the mouse over them. That's the main problem, because after that everything works fine and the images swap correctly.

Can anyone tell me why the images don't appear on loading?

Also, is it possible to place these images as rows in a table?

Thanks in advance.

Russell.

[premshree]

Try this script:

<script language="JavaScript1.2">
if (document.images)
{
// Add the rollover images to this array
var imglist = new Array (
"images/r1.gif",
"images/r2.gif",
"images/r3.gif"
);
var imgs = new Array(); var count;
for (count=0; count<imglist.length; count++)
{
imgs[count]=new Image();
imgs[count].src=imglist[count];
}
}

// Main function
function hilite(name,m)
{
if (document.images)
{
imgswap(name, imgs[m])
}
}

// Image swap function
function imgswap(i1,i2)
{
if (document.images)
{
var temp = i1.src; i1.src=i2.src; i2.src=temp;
}
}
</script>

<a href="page1.htm" onmouseover="hilite(link1,0)" onmouseout="hilite(link1,0)"><img src="image1.gif" width="150" height="30" name="link1" border="0"></a>

<a href="page2.htm" onmouseover="hilite(link2,1)" onmouseout="hilite(link2,1)"><img src="image2.gif" width="150" height="30" name="link2" border="0"></a>

<a href="page3.htm" onmouseover="hilite(link3,2)" onmouseout="hilite(link3,2)"><img src="image3.gif" width="150" height="30" name="link3" border="0"></a>

To place images in a row, plcae them normally in HTML.