Hi:
The reason it doesn't work as expected is because you're using this script inside an image map, so the script does not know where exactly to drop down relative to the "hot" zone. In your case, modify the script as follows to correctly drop down beneath the Golf square:
1) Replace function dropdownmenu() inside the code of Step 1 with the below version instead:
Code:
function dropdownmenu(obj, e, menucontents, menuwidth){
var offsetfrommap=parseInt(obj.coords)
var obj=document.getElementById("mainimage") //change obj parameter to reference image map img instead
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)
if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+offsetfrommap+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}
return clickreturnvalue()
}
2), Then, modify your HTML to give the image used by the image map an ID:
Code:
<IMG id="mainimage" height=321
src="client_files/photo_home.jpg" width=703 useMap=#photo_home
border=0>
That's it.
Bookmarks