onMouseOver, image map & xhtml in a .js file

admin

Administrator
Staff member
I have a site that I wrote in XHTML. I have an image map at the top of each page that serves as a nav bar. Rather than having that code in each page I have it in an external .js file. The code works fine but I want to add an onMouseOver for each of the area tags. When I add the code for the mouse over and mouse out events, the mouse out works but the mouse over does not. Can anyone see anything wrong with the code below? This is the full content of the .js file. I'm using "Out" in the onMuseOut event just for testing purposes.

var map;
map = "<map name='nav' id='navigationmap'>"
map = map + "<area shape='rect' coords='0,0,67,29' alt='News' href='http://www.webdeveloper.com/news/' onMouseover=\"window.status='News'; return true;\" onMouseOut=\"window.status='Out'; return true;\" />"
map = map + "<area shape='rect' coords='68,0,141,29' alt='History' href='http://www.webdeveloper.com/history/' onMouseOver=\"window.status='History'; return true\" onMouseOut=\"window.status='Out'; return true;\" />"
map = map + "<area shape='rect' coords='142,0,241,29' alt='Discography' href='http://www.webdeveloper.com/discography/' onMouseOver=\"window.status='Discography'; return true\" onMouseOut=\"window.status='Out'; return true;\" />"
map = map + "<area shape='rect' coords='242,0,338,29' alt='Biographies' href='http://www.webdeveloper.com/biographies/' onMouseOver=\"window.status='Biographies'; return true\" onMouseOut=\"window.status='Out'; return true;\" />"
map = map + "<area shape='rect' coords='589,0,651,29' alt='Links' href='http://www.webdeveloper.com/links/' onMouseOver=\"window.status='Links'; return true\" onMouseOut=\"window.status='Out'; return true;\" />"
map = map + "</map>"


document.write(map);
 
Back
Top