title: Change background of mapped image hotspot on mouseover
body: <p>I have an image map of 3 polygons.  The actual image hotspots are complex shapes consisting of multiple curves and edges. </p>
  
  <pre><code>&lt;img src="/images/map.gif" alt="HTML Map" 
          border="0" usemap="#map"/&gt;
  
  &lt;map name="map"&gt;
     &lt;area shape="poly" 
              coords="74,0,113,29,98,72,52,72,38,27"
              href="index.htm" alt="area1" /&gt;
  
     &lt;area shape="poly" 
              coords="22,83,126,125"
              href="index.htm" alt="area2" /&gt;
  
     &lt;area shape="poly" 
              coords="73,168,32"
              href="index.htm" alt="area3" /&gt;
  &lt;/map&gt;
  </code></pre>
  
  <p>I've created a duplicate of map.gif called map_over.gif rendered in a different color.  What I'd like to do is change the area within the clickable hotsposts of map.gif to map_over.gif on mouse hover.  Any suggestions as to how I could accomplish this with CSS or Javascript?  Thanks in advance.   </p>