Question : How to make hotspot rollovers work in Internet Explorer?

Greetings Experts—I have created a website using Adobe Dreamweaver CS4. I made a menu that uses hotspots and the swap image behavior to make rollovers that change color and allow navigation to other pages in the site. The navigation part works, but not the image swap, except in Firefox, of course. I need to get this to work in other browsers, especially Internet Explorer.

I have attached the code for that section of the page as well as the CSS rule for that div. If anyone can enlighten me on what I need to do to make this work, I will be eternally grateful!
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
<div id="nav"><img src="images/navlist-top_03.gif" alt="menu" width="177" height="550" border="0" usemap="#Map" id="Image1" />
  <map name="Map" id="Map">
    <area shape="rect" coords="22,68,78,84" href="ourfirm-history.html" alt="our history" onmouseover="MM_swapImage('Image1','','images/navlist-hist-top.gif',1)" onmouseout="MM_swapImgRestore()" />
    <area shape="rect" coords="24,128,108,157" href="ourfirm-philosophy.html" alt="investment philosophy" onmouseover="MM_swapImage('Image1','','images/navlist-iproll-top.gif',1)" onmouseout="MM_swapImgRestore()" />
    <area shape="rect" coords="10,307,137,326" href="account.html" alt="your account" onmouseover="MM_swapImage('Image1','','images/navlist-acctroll-top.gif',1)" onmouseout="MM_swapImgRestore()" />
    <area shape="rect" coords="23,218,153,232" href="services-client.html" alt="client information" onmouseover="MM_swapImage('Image1','','images/navlist-ciroll-top.gif',1)" onmouseout="MM_swapImgRestore()" />
    <area shape="rect" coords="25,248,155,263" href="services-fees.html" alt="fee arrangements" onmouseover="MM_swapImage('Image1','','images/navlist-faroll-top.gif',1)" onmouseout="MM_swapImgRestore()" />
    <area shape="rect" coords="9,486,113,504" href="contact.html" alt="contact us" onmouseover="MM_swapImage('Image1','','images/navlist-ciroll-top.gif',1)" onmouseout="MM_swapImgRestore()" />
<area shape="rect" coords="22,97,62,113" href="ourfirm-staff.html" alt="our staff" onmouseover="MM_swapImage('Image1','','images/navlist-staffroll-top.gif',1)" onmouseout="MM_swapImgRestore()" />
  </map>
</div>

And here is the rule for #nav:

#nav {
	height: 550px;
	width: 177px;
	margin: 0px;
	float: left;
	padding: 0px;
	background-image: url(images/navlist.gif);
	background-repeat: no-repeat;

Answer : How to make hotspot rollovers work in Internet Explorer?

The easiest way to do that is still with CSS and not with an imagemap. If you position text over the image, the color change is a snap.

If you insist on doing this with an imagemap, then scrathcyboy is most likely correct in that the internal Dreamweaver swap image behavior is not playing well with whichever version of IE is having the problem.  This is probably best solved by not using the behavior and searching for a different/newer one.
Random Solutions  
 
programming4us programming4us