Howto create rollovers in imagemaps?

[timothy]

I'm trying to create rollovers inside an imagemap. I'm using Gimp 2.0 to
create the graphics and maps and Quanta 3.2.1 to edit code. Here's my code
as of now:

<img src="map.png" width="256" height="256" border="0" usemap="#map">
<map name="map">

<area shape="circle" name=one coords="128,134,57"
onmouseover="document.one.src='/map/image/green.png'"
onmouseout="document.one.src='/map/image/red.png'"
href="http://www.google.com" /> </map>

How can I fix this issue? Thanks to all who reply......

 

[Philip Ronan]

I'm trying to create rollovers inside an imagemap. I'm using Gimp 2.0 to
create the graphics and maps and Quanta 3.2.1 to edit code. Here's my code
as of now:

<img src="map.png" width="256" height="256" border="0" usemap="#map">
<map name="map">

<area shape="circle" name=one coords="128,134,57"
onmouseover="document.one.src='/map/image/green.png'"
onmouseout="document.one.src='/map/image/red.png'"
href="http://www.google.com" /> </map>

How can I fix this issue? Thanks to all who reply......

Unless I'm very much mistaken, what you're trying to do is impossible.

Break your clickable parts into separate images (using CSS to place them in
the appropriate positions), and script them as ordinary roll-over images.

 

[timothy]

Unless I'm very much mistaken, what you're trying to do is impossible.

Break your clickable parts into separate images (using CSS to place them
in the appropriate positions), and script them as ordinary roll-over
images.

The gimp plug-in that creates maps for me has javascript events
intergrated into the plug in. I was assuming that it was possibe. This
person has a tutorial on dis-jointed rollovers and imagemaps,:
http://www.daxassist.com/js/disjointedimagemap.cfm
but as you can tell, I wish to have in with in the map it's self. I've
seen some general information on google that suggests that it's possible,
unsure if it's efficient, but possible.

 

[NOXwebmasterx]

I'm trying to create rollovers inside an imagemap. I'm using Gimp 2.0 to
create the graphics and maps and Quanta 3.2.1 to edit code. Here's my code
as of now:

<img src="map.png" width="256" height="256" border="0" usemap="#map">
<map name="map">

<area shape="circle" name=one coords="128,134,57"
onmouseover="document.one.src='/map/image/green.png'"
onmouseout="document.one.src='/map/image/red.png'"
href="http://www.google.com" /> </map>

How can I fix this issue? Thanks to all who reply......

Image maps have some accessibility problems; methods have been
invented to get around using them. This involves using actual text
in transparent divs that overlay an image. CSS hover qualities
can be set for the text in the divs, and for the background of the divs
too, if you wish. There was an article at alistapart a while back --
http://www.alistapart.com/articles/imagemap/
....which IMO is a great improvement over old style image maps.

 

[Jeffrey Silverman]

The gimp plug-in that creates maps for me has javascript events
intergrated into the plug in. I was assuming that it was possibe. This
person has a tutorial on dis-jointed rollovers and imagemaps,:
http://www.daxassist.com/js/disjointedimagemap.cfm
but as you can tell, I wish to have in with in the map it's self. I've
seen some general information on google that suggests that it's possible,
unsure if it's efficient, but possible.

You can probably do rollovers within an image map but the rollover will
have to replace the entire image map image. Which makes it much less good
than indivijulary rollover images.