PDA

Click to See Complete Forum and Search --> : Image Map Rollover....How???

AnacondaAndy
12-06-2003, 12:42 PM
Could someone please tell me how to do a image map rollover? I know how to do a image map...and I tryed to add a rollover and it did not work...thanks for any help!!:D
Khalid Ali
12-06-2003, 01:33 PM
u need to to add onmouseover and out events to your mapped image maps..
Post the code for a better answer or a link to where you have implemented this code
AnacondaAndy
12-06-2003, 02:39 PM
Here is the code....It supposed to be a image map with a rollover...and I don't know what the erorr is...thanks for any help!!



<IMG SRC="menu.gif" HEIGHT=183 WIDTH=247
ALT="imagemap" usemap="#map" border="0">

<map name="map">


<area shape="rect" coords="6,6,120,45"
href="home.html"
onMouseOver="src='home3_lit.gif'"
onMouseOut="src='menu.gif'"
alt="Home">


</map>



thanks!:D
demo
12-07-2003, 07:30 AM
try:

<IMG SRC="menu.gif" HEIGHT=183 WIDTH=247
ALT="imagemap" usemap="#map" border="0">

<map name="map">


<area shape="rect" coords="6,6,120,45"
href="home.html"
onMouseOver="this.src='home3_lit.gif'"
onMouseOut="this.src='menu.gif'"
alt="Home">


</map>

demo
AnacondaAndy
12-08-2003, 04:45 PM
Thanks for your help....but it still won't work...any
suggestions? I attached the file....it is only about
10 lines long....BTW...this is the first time I have
ever done a rollover. Well thanks again....:)
AnacondaAndy
12-08-2003, 11:46 PM
*Bump*
little jim
12-09-2003, 11:35 AM
It's simple, you are saying 'this.src=' in your code, but when you say that it thinks you mean the area because thats the tag you are saying it in. Try this..

<IMG ID="aab" SRC="menu.gif" HEIGHT=183 WIDTH=247
ALT="imagemap" usemap="#map" border="0">

<map name="map">


<area shape="rect" coords="6,6,120,45"
href="home.html"
onMouseOver="document.getElementById('aab').src ='home3_lit.gif'"
onMouseOut="document.getElementById('aab').src = 'menu.gif'"
alt="Home">


</map>
AnacondaAndy
12-18-2003, 08:13 PM
Thanks....but I got a question??? Do I have to put any JavaScript in the code to make the rollovers work? Could somebody post some code with a simple working rollover for me? That would be real helpful....thanks!

P.S. Sorry it took so long to respond...I had to wipe off my computers hard drive and I lost everything, and it took me a while to set everything back up!:D
Pittimann
12-19-2003, 02:07 AM
Hi!

The example posted by little jim works! So what's the problem? Are you using a 4.x browser???

Cheers - Pit
AnacondaAndy
12-19-2003, 07:08 AM
No Pit I'm using the Internet Explorer 6.0.26. Thanks again all.
Pittimann
12-19-2003, 07:14 AM
Hi!

Please make sure that your images are situated in the same folder like the file containing the map and that the filenames are correct...

Cheers - Pit
AnacondaAndy
12-19-2003, 08:43 AM
My images are in the same folder...and they show up...they just don't do the rollover thingy...
Pittimann
12-19-2003, 08:55 AM
Hi!

Have a try with that:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<IMG name="aab" SRC="menu.gif" HEIGHT=183 WIDTH=247
ALT="imagemap" usemap="#map" border="0">
<map name="map">
<area shape="rect" coords="6,6,120,45" href="home.html" onMouseOver="document.aab.src ='home3_lit.gif'" onMouseOut="document.aab.src = 'menu.gif'" alt="Home">
</map>
</body>
</html>

Cheers - Pit
AnacondaAndy
12-19-2003, 10:11 AM
Thanks Pit....I'll try it as soon as I make some images for it...I lost all my images when my comp crashed.