Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

image map area background color

Status
Not open for further replies.

Zarcom

Programmer
May 7, 2002
1,275
CA
Hi I was wondering if it is possible to set the color or an <Area> shape? What I would like is for a transparent color to reside in the <Area> shape. On certain circumstances (server side) that color may change so the area be more noticable. The user still needs to be able to see the image underneath thoug.

Thanks for your help That'l do donkey, that'l do
[bravo] Mark
If you are unsure of forum etiquette check here faq796-2540
 
Make your image a GIF with transparency.

Cheers,
[monkey] Edward [monkey]

&quot;Cut a hole in the door. Hang a flap. Criminy, why didn't I think of this earlier?!&quot; -- inventor of the cat door
 
uh huh but how do I set the color of the <area.. tag.

You know

<MAP NAME=&quot;map&quot;>
<AREA ID=&quot;M1&quot; SHAPE=&quot;POLY&quot; HREF=&quot;M1.jpg&quot; ALT=&quot;M1&quot; COORDS=&quot;215,37, 237,37, 237,55, 215,56, 215,37&quot; color=&quot;#00ff00&quot;>
</Map>


'cept the color bit doesn't work. That'l do donkey, that'l do
[bravo] Mark
If you are unsure of forum etiquette check here faq796-2540
 
I suppose you could try specifying the class in an external stylesheet (I don't know if you can do that), but a transparent GIF will just take the color of the area behind it -- the map area isn't relevant. It would be like trying to change the color inside the top half of an &quot;R&quot; character. You can't bust your GIF up into separate chunks and have a different color behind each chunk.

A way to simulate that is to have the mouseover event be a little more specific, such that it loads a unique file based on the mouse position. So, you have your imagemap, and on the mouseover event, you feed the mouse coordinates to a function that figures out in which region the mouse is located and then loads the appropriate new-image for the mouseover. For example, you have a map of the US and the lakes are transparent. You'll need one image that is AllUnhighlighted.gif and ArizonaHighlighted.gif and AlaskaHighlighted.gif and AlabamaHighlighted.gif, etc.

I might be wrong, though.

Cheers,
[monkey] Edward [monkey]

&quot;Cut a hole in the door. Hang a flap. Criminy, why didn't I think of this earlier?!&quot; -- inventor of the cat door
 
So wat is the answer here? has anyone found the answer? i ve this problem too..i ve tried using class or inline styles to either add a background-color or image but they dont work..
 
You can do as Edward suggested and swap the image on click. I ditched the idea completely as it would not be worth it in my situation

That'l do donkey, that'l do
[bravo] Mark
If you are unsure of forum etiquette check here faq796-2540
 
His idea is not feasible to the situation. I need to have different colors for some specific hot areas and they depend on my database. Does anyone faced the same situation and has managed to turn it around?
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top