multiple html onmouseover

They have: 5,633 posts

Joined: Jan 1970

How can I get several HTML link OnMouseOver to lightup images in the exact same place ... like a slide show only the mouseovers are HTML in text not the usual "next" buttons ...

John Pollock's picture

He has: 628 posts

Joined: Mar 1999

I'm not sure exactly what you are getting at, but the rollover for different image tutorial might help a little:

http://www.pageresource.com/jscript/jhover1.htm

Hope this helps.

John Pollock's picture

He has: 628 posts

Joined: Mar 1999

I think this will work. Just change the image urls in the script, and to add images use img3, img4, and so on where the img1 and img2 shows up in the script here. Change the image width and height values to match yours as well. Smiling

<HTML>
<HEAD>
<TITLE>test</TITLE>

<SCRIPT language="JavaScript">
<!--
if (document.images)
{
img1on= new Image(100,25);
img1on.src="../images/shoes2.gif";

img1off= new Image(100,25);
img1off.src="../images/shoes1.gif";

img2on= new Image(100,25);
img2on.src="../images/shoes2.gif";

img2off= new Image(100,25);
img2off.src="../images/shoes1.gif";

}

function lightup(imgName)
{
if (document.images)
{
getit=imgName;
imgOn=eval(imgName + "on.src");
document.pic1.src= imgOn;
}
}

function flashout(imgName)
{
imgOff=eval(imgName + "off.src");
document.pic1.src= imgOff;
}
//-->
</SCRIPT>

</HEAD>
<BODY>

<A HREF="http://someplace.com" onMouseover="lightup('img1')" onMouseout="flashout('img1')">Link1 or IMG Link</A>
<A HREF="http://someplace.com" onMouseover="lightup('img2')" onMouseout="flashout('img2')">Link2 or IMG Link</A>
<P>
<IMG SRC="../images/shoes1.gif" name="pic1" width="100" height="25">

</BODY>
</HTML>

------------------
John Pollock
http://www.pageresource.com
http://www.javascriptcity.com

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.