How to show the border of hotspot of ImageMap Control in ASP.Net ?

Question

I add a map of USA to this control. And I want to show the borders of each states of USA when I move mouse over in it. Help me this problem. Thanks a lot.

Roei Bar · Answer

hey you can do this using JQuery either use this : http://plugins.jquery.com/project/maphilight or on use this Jquery : $ ( document ). ready ( function () { $ ( .map-areas area ). mouseenter ( function () { var idx = $ ( .map-areas area ). index ( this ); $ ( .map-hovers img:eq( + idx + ) ). show (); return false ; }). mouseleave ( function () { $ ( .map-hovers img ). hide (); return false ; }); }); div id = container > img src = /images/trans.gif width = 220 height = 238 class = map-trans alt = Map / Carte usemap = #region-map /> div class = map-hovers > img src = /images/map/sunset-country.png alt = Sunset Country /> img src = /images/map/north-of-superior.png alt = North of Superior /> img src = /images/map/algomas-country.png alt = Algoma's Country /> img src = /images/map/ontarios-wilderness.png alt = Ontario's Wilderness /> img src = /images/map/rainbow-country.png alt = Rainbow Country /> img src = /images/map/ontarios-near-north.png alt = Ontario's Near North /> img src = /images/map/muskoka.png alt = Muskoka /> div > div > map name = region-map id = region-map class = map-areas > area shape = poly coords = 5219538236114341262613051212110762 href = #d0 alt = Sunset Country /> area shape = poly coords = 93136931138211277655751588241122331335813874126 href = #d1 alt = North of Superior /> area shape = poly coords = 9811211812313114913016510816197138 href = #d2 alt = Algoma's Country /> area shape = poly coords = 6821002912433133741559615914513414612111910111083107836555455416 href = #d3 alt = Ontario's Wilderness /> area shape = poly coords = 151151152167157176152179137178124172133169135150 href = #d4 alt = Rainbow Country /> area shape = poly coords = 160150170167169173160171155162153149 href = #d5 alt = Ontario's Near North /> area shape = poly coords = 173176162177154184167189178183 href = #d6 alt = Muskoka /> map > Notice how the image map area index lines up with the img index within the map-hovers container? ALSO: The image map must point to a transparent gif and have the background image set to the actual image you want to display.