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!

Mouseover using hotspots ??

Status
Not open for further replies.

Billybonga

IS-IT--Management
Jun 22, 2002
72
GB
I am designing a page where there is one image map of Europe with Business head quarters pin-pointed around it. I have set hotspot areas on the areas and want to show details of these locations opposite the picture of Europe when a person hovers over the Hotspot.

For example - when a customer hovers over the hotspot "Shannon - Ireland" another image will appear to the right of the map showing the Company Information.

I have tried to do a mouseover script but can't seem to get it to work - can anyone help.

'rollover' refers to a blank image roller.jpg (named roller) that is to the right of the Map of Europe - its this image that will change to another image - e.g. Shannon.jpg when the user hovers over the hotspot. The Map of Europe Shouldn't change


Below is the script for the Shannon Hover-over:

<map name=&quot;Europe&quot; id=&quot;Europe&quot;>

<area shape=&quot;rect&quot; coords=&quot;119,93,135,108&quot; href=&quot;Shannon&quot; alt=&quot;Shannon Ireland&quot;
onmouseover=&quot;MM_swapImage('Europe','','images/locations.jpg','rollover','','images/rollovers/shannon.jpg',1)&quot;
onmouseout=MM_swapImgRestore() >


<area shape=&quot;rect&quot; coords=&quot;142,81,153,96&quot; href=&quot;Edin-Scot&quot; alt=&quot;Edinburgh - Scotland&quot;>
<area shape=&quot;rect&quot; coords=&quot;197,40,218,56&quot; href=&quot;#&quot; alt=&quot;Sveg Sweden&quot;>
<area shape=&quot;rect&quot; coords=&quot;196,72,207,86&quot; href=&quot;ed-swed&quot; alt=&quot;Ed. Sweden&quot;>
<area shape=&quot;rect&quot; coords=&quot;252,171,269,187&quot; href=&quot;#&quot;>
<area shape=&quot;rect&quot; coords=&quot;140,133,163,145&quot; href=&quot;france&quot; alt=&quot;Elis - France&quot;>
<area shape=&quot;rect&quot; coords=&quot;190,173,203,186&quot; href=&quot;italy&quot; alt=&quot;Florence Iraly&quot;>
<area shape=&quot;rect&quot; coords=&quot;209,145,224,155&quot; href=&quot;hungry&quot; alt=&quot;Bud&quot;>
<area shape=&quot;rect&quot; coords=&quot;170,134,187,146&quot; href=&quot;#&quot; alt=&quot;Esslingen - Germany &quot;>
<area shape=&quot;rect&quot; coords=&quot;162,108,174,119&quot; href=&quot;Amsterdam&quot; alt=&quot;Amsterdam&quot;>
<area shape=&quot;rect&quot; coords=&quot;169,120,179,128&quot; href=&quot;boc-germany&quot; alt=&quot;Bochum - Germany&quot;>
<area shape=&quot;rect&quot; coords=&quot;185,123,192,133&quot; href=&quot;Aach-Germany&quot;>
<area shape=&quot;rect&quot; coords=&quot;183,101,193,113&quot; href=&quot;wilh-germany&quot; alt=&quot;Wilh&quot;>
<area shape=&quot;rect&quot; coords=&quot;196,105,207,116&quot; href=&quot;#&quot; alt=&quot;Pasewalk - Germany&quot;>
<area shape=&quot;rect&quot; coords=&quot;181,113,195,122&quot; href=&quot;#&quot; alt=&quot;Hannover - Germany &quot;>
</map>
 
You'll need to &quot;slice&quot; your map images to do what you ant to do. Most Image slicers have a built-in rollover utility that takes the pain out of doing it manually. There's always a better way...
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top