ここに私のコードがあります:
function addAlbum(){
var attr;
var parent;
var newelement;
/*image*/
newelement = document.createElement("img");
newelement.src = "criar_album.png";
attr = document.createAttribute("id");
attr.value = "addalbum";
newelement.setAttributeNode(attr);
attr = document.createAttribute("usemap");
attr.value = "#addalbum_map";
newelement.setAttributeNode(attr);
parent = document.getElementById("content");
parent.appendChild(newelement);
/*-----------------------------------------*/
/*map*/
newelement = document.createElement("map");
attr = document.createAttribute("id");
attr.value = "album_map";
newelement.setAttributeNode(attr);
attr = document.createAttribute("style"); /*this part is failing I guess*/
attr.value = "cursor:pointer";
newelement.setAttributeNode(attr);
attr = document.createAttribute("name");
attr.value = "addalbum_map";
newelement.setAttributeNode(attr);
parent = document.getElementById("addalbum");
parent.appendChild(newelement);
/*-----------------------------------------*/
/*area*/
newelement = document.createElement("area");
attr = document.createAttribute("shape");
attr.value = "rect";
newelement.setAttributeNode(attr);
attr = document.createAttribute("coords");
attr.value = "73, 238, 115, 264";
newelement.setAttributeNode(attr);
attr = document.createAttribute("onclick");
attr.value = "createAlbum()";
newelement.setAttributeNode(attr);
attr = document.createAttribute("onmouseover");
attr.value = "highlightOn(470,320,511,346,2)";
newelement.setAttributeNode(attr);
parent = document.getElementById("album_map");
parent.appendChild(newelement);
/*-----------------------------------------*/
}
エリア要素にカーソルを渡すたびにカーソルの一部が変化することを除いて、すべてが正常に機能しているようです。私はhtmlで定義された静的画像で同様のことをしましたが、それが機能するので、動的に作成されたマップでなぜ機能しないのか混乱していますか?
PS: すでに CSS で「addalbum」ID のスタイルを定義していますが、役に立ちませんでした。ところで、href を定義するようなトリッキーな方法でそれを行う方法があることは知っていますが、ここでの本当の問題は何かを知りたいです。