Welcome to WebmasterWorld Guest from

Forum Moderators: open

Message Too Old, No Replies

Creating Usemaps for IE with JavaScript

7:26 pm on Nov 1, 2006 (gmt 0)

New User

10+ Year Member

joined:Nov 1, 2006
votes: 0

Has anyone had an issue creating usemaps for images using Javascript?

The problem I've been having is related to this code:

this.titleTopImage = document.createElement("img");
this.titleTopImage.setAttribute("src", this.topImagePath);
this.titleTopImage.setAttribute("display", "block");
this.titleTopImage.setAttribute("usemap", "#close");
this.titleTopImage.setAttribute("style", "border: none");

this.titleMap = document.createElement("map");
this.titleMap.setAttribute("id", "close");
this.titleMap.setAttribute("name", "close");

this.titleArea = document.createElement("area");
this.titleArea.setAttribute("shape", "rect");
this.titleArea.setAttribute("coords", "137,3,148,13");
this.titleArea.setAttribute("href", "javascript: GLT.clickOutElm(true)");

As you can see, it creates an image with an image map from javascript. The imagemap is for the close button on upper right corner. What it doesn't do is create the usemap for this area in the MSIE, whereas the same area seems linked and ready to go in Firefox. I can't think of a reason why it's doing this, except for the cross-browser issues.

Thanks in advance.

9:14 pm on Nov 1, 2006 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Sept 22, 2002
votes: 0

Hello & welcome, picardo.

IE wants us to spell usemap as useMap... Rather annoying, but this should work for IE:

element.setAttribute("useMap", "#close");

Or, add a third parameter, which defines case-sensitivity (default is 1, case-sensitive):

element.setAttribute("usemap", "#close", 0);