OnMouseOver() with an imagemap

Hi,
I am designing a website with an imagemap as a navigation pane and I want an effect to happen when certain parts of the image are rolled over by the mouse. I want to switch the imagemap image to a different one (one which highlights the rolled-over bit) depending on which bit gets rolled over. (Sorry if this is confusing) This is my code:

[code=html]<img id=”Image-Maps_9201104271548429″ src=”imgmap.jpg” usemap=”#Image-Maps_9201104271548429″ border=”0″ width=”960″ height=”90″ alt=””>
<map id=”_Image-Maps_9201104271548429″ name=”Image-Maps_9201104271548429″>
<area shape=”rect” coords=”17,10,166,77″ href=”index.htm” alt=”Home” title=”Home” OnMouseOver=”home()” OnMouseOut=”normal()”>
<area shape=”rect” coords=”193,10,403,77″ href=”about.html” alt=”About Us” title=”About Us” OnMouseOver=”about()” OnMouseOut=”normal()”>
<area shape=”rect” coords=”421,10,652,77″ href=”contact.html” alt=”Contact Us” title=”Contact Us” OnMouseOver=”contact()” OnMouseOut=”normal()”>
<area shape=”rect” coords=”667,12,878,79″ href=”services.html” alt=”Services” title=”Services” OnMouseOver=”services()” OnMouseOut=”normal()”>
</map>[/code]

This is my JavaScript code:

[CODE]
<SCRIPT TYPE=”text/javascript”>
Image1 = new Image(960,90)
Image1.src = “home.jpg”
Image2 = new Image(960,90)
Image2.src = “about.jpg”
Image3 = new Image(960,90)
Image3.src = “contact.jpg”
Image4 = new Image(960,90)
Image4.src = “services.jpg”
Image5 = new Image(960,90)
Image5.src = “imgmap.jpg”
</SCRIPT>
<SCRIPT TYPE=”text/javascript”>
function home() {
document.Image-Maps_9201104271548429.src = Image1.src; return true;
}
function about() {
document.Image-Maps_9201104271548429.src = Image2.src; return true;
}
function contact() {
document.Image-Maps_9201104271548429.src = Image3.src; return true;
}
function services() {
document.Image-Maps_9201104271548429.src = Image4.src; return true;
}
function normal() {
document.Image-Maps_9201104271548429.src = Image5.src; return true;
}
</SCRIPT>[/CODE]

This doesn’t work, the image stays the same no matter which bit the mouse rolls over. Can you please tell me where I am going wrong? I don’t know javascript and am following instruction from [URL=”http://www.htmlgoodies.com/tutorials/image_maps/article.php/3479771/So-You-Want-An-Imagemap-Image-Flip-Huh.htm”]this website[/URL].

Thank you in advance for your help.

–Matthew

Also in #JavaScript _↴