This ImageMap is annoying me!

[Dapandyman]

This only has a little javascript - i think thats the problem though.
I'm starting a template business and i was making my site but the ImageMap for the menu refuses to work - i am completely puzzled ( ) because all previous ImageMaps of mine have been perfect - someone help please (THE IMAGEMAP IS MEANT TO ROLLOVER TO LOOK LIKE THE TABS ARE HIGHLIGHTED RED).

here's how it's going

Thanks,
Dapandyman.


Code for my menu:

Code: Select all

 
<SCRIPT LANGUAGE="javascript">
Image1 = new Image(700,300) border="0"
Image1.src = "menu[tt].jpg"
 
Image2 = new Image(700,300) border="0"
Image2.src = "menu[tt][2].jpg"
 
Image3 = new Image(700,300) border="0"
Image3.src = "menu[tt][3].jpg" 
 
Image4 = new Image(700,300) border="0"
Image4.src = "menu[tt][4].jpg" 
 
Image5 = new Image(700,300) border="0"
Image5.src = "menu[tt][5].jpg" 
 
Image6 = new Image(700,300) border="0"
Image6.src = "menu[tt][6].jpg" 
 
Image7 = new Image(700,300) border="0"
Image7.src = "menu[tt][7].jpg" 
 
 
</SCRIPT> 
 
 
 
 
 
<IMG NAME="menu" src="menu[tt].jpg" usemap="#menu" width="700" height="300" border="0" />
 
 
 
 
 
 
<SCRIPT LANGUAGE="javascript">
 
function help() {
document.menu.src = Image7.src; return true;
}
 
function extras() {
document.menu.src = Image6.src; return true;
}
 
function quality() {
document.menu.src = Image5.src; return true;
}
 
function cheap() {
document.menu.src = Image4.src; return true;
}
 
function free() {
document.menu.src = Image3.src; return true;
}
 
function home() {
document.menu.src = Image2.src; return true;
}
 
function original() {
document.menu.src = Image1.src; return true; 
}
 
 
 
</SCRIPT> 
 
 
 
 
 
 
<map name="menu">
 
 
 
<area shape="poly" alt="Go Home!" coords="12,228,119,228,129,219,133,210,134,200,134,177,12,173" href="index.html" onMouseOver="home()" onMouseOut="original()"/>
 
 
<area shape="poly" coords="134,176,236,177,236,206,229,221,213,227,117,227,128,218,133,209,133,200" alt="Free Templates!" href="free.html" onMouseOver="free()" onMouseOut="original()" />
 
 
<area shape="poly" coords="214,228,229,220,230,220,235,211,234,176,338,176,339,208,333,222,314,228" alt="Low-Budget Templates!" href="cheap.html" onMouseOver="free()" onMouseOut="original()"/>
 
 
<area shape="poly" coords="318,228,337,217,340,206,340,195,339,176,445,176,447,203,443,215,436,222,426,227,422,228" alt="High-Quality Templates" href="quality.html" onMouseOver="free()" onMouseOut="original()"/>
 
 
<area shape="poly" coords="426,228,437,220,443,214,447,202,446,175,545,175,545,204,544,212,538,218,534,222,517,228" alt="Get MORE!" href="extras.html" onMouseOver="free()" onMouseOut="original()"/>
 
 
<area shape="poly" coords="517,228,534,222,539,219,546,204,546,174,640,174,644,204,637,220,624,229,621,228" alt="Help!" href="help.html" onMouseOver="free()" onMouseOut="original()"/>
 
 
<AREA SHAPE="default" nohref>
 
 
</map>

[ukgeoff]

Your link shows an empty page.

More to the point, this is not the way to produce menus for modern web sites.

There is a tutorial available via the sticky in the css forum on producing css driven menu systems. I suggest you have a look at this and rethink your approach.

[Dapandyman]

Ok,
Thanks,
Dapandyman.