AnyLink Drop Down Menu problems
i am using the AnyLink Drop Down Menu to create drop down menus off my image map. i have a horizontal bar jpeg as my navbar and am using an image map for the links.
the problem is that the drop down menus appear to the far left and not under the link like i want.
thanks,
Jeff
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sigma Alpha Epsilon Home</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
/***********************************************
* AnyLink Drop Down Menu- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
//Contents for menu 1 Tn Eta
var menu1=new Array()
menu1[0]='<a href="index.htm">Home</a>'
menu1[1]='<a href="accomplishments.htm">Accomplishments</a>'
menu1[2]='<a href="house">house</a>'
menu1[3]='<a href="photo.htm">Pictures</a>'
//Contents for menu 2, Nationals
var menu2=new Array()
menu2[0]='<a href="http://sae.net/">Nationsals Nome</a>'
menu2[1]='<a href="http://www.truegentlemaninitiative.net/">TGI Initiative</a>'
menu2[2]='<a href="https://incircle.sae.net/">Members Only</a>'
//Contents for menu 3, Memebers
var menu3=new Array()
menu3[0]='<a href="members.htm">Memebers</a>'
menu3[1]='<a href="officers.htm">Officers</a>'
menu3[2]='<a href="pledges.htm">Pledges</a>'
//Contents for menu 4, events
var menu4=new Array()
menu4[0]='<a href="events.htm">Events Home</a>'
menu4[1]='<a href="fundraiser.htm">Fundraising</a>'
menu4[2]='<a href="community.htm">Community Services</a>'
//Contents for menu 5, Rush
var menu5=new Array()
menu5[0]='<a href="rush.htm">Rush SAE</a>'
menu5[1]='<a href="http://www.uu.edu/studentservices/organizations/ifc.cfm">Why go greek</a>'
menu5[2]='<a href="http://www.uu.edu/studentservices/organizations/greek.cfm">Union Greek</a>'
//Contents for menu6, Alumni
var menu6=new Array()
menu6[0]='<a href="alumni.htm">Information</a>'
menu6[1]='<a href="mailList.htm">Mailing List</a>'
var menuwidth='165px' //default menu width
var menubgcolor='#333333' //menu bgcolor
var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?
/////No further editting needed
var ie4=document.all
var ns6=document.getElementById&&!document.all
if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';background-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')
function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top="-500px"
if (menuwidth!=""){
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
}
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWidth-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeight-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}
function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}
function dropdownmenu(obj, e, menucontents, menuwidth){
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")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}
return clickreturnvalue()
}
function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}
function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}
function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}
function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}
function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}
if (hidemenu_onclick=="yes")
document.onclick=hidemenu
</script>
</head>
<body>
<div id="header">
<img src="header.jpg" alt="Sigma Alpha Epsilon" border="0" usemap="#Map2" />
<map name="Map2" id="Map2"><area shape="circle" coords="86,132,70" href="index.htm" alt="Coat" />
</map>
</div>
<div id= "NavBar">
<img src="navbar.jpg" alt="NavBar" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="180,4,271,51" href="index.htm" alt="Tn Eta" clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu1, '140px')" onMouseout="delayhidemenu()" >
<area shape="rect" coords="271,2,361,48" href="nationals.htm" alt="Nationals" clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu2, '160px')" onMouseout="delayhidemenu()" >
<area shape="rect" coords="364,3,457,47" href="members.htm" alt="Members" clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu3, '120px')" onMouseout="delayhidemenu()" >
<area shape="rect" coords="456,1,547,46" href="events.htm" alt="Events"clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu4, '120px')" onMouseout="delayhidemenu()" >
<area shape="rect" coords="546,3,640,54" href="rush.htm" alt="Rush" clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu5, '120px')" onMouseout="delayhidemenu()" >
<area shape="rect" coords="640,4,730,53" href="alumni.htm" alt="Alumni" clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu6, '120px')" onMouseout="delayhidemenu()" >
<area shape="rect" coords="17,-9,152,41" href="index.htm" alt="of" />
</map></div>
<div id= "coatBottom">
<img src="bumb.jpg" alt="" width="161" height="50" border="0" usemap="#Map3" />
<map name="Map3" id="Map3"><area shape="circle" coords="86,-17,60" href="index.htm" alt="Arms" />
</map>
</div>
<div id="sideBar">
<p> hey </p>
</div>
<div id="main">
<div id="rightColumn">
<p> hey </p>
</div>
<p> The Tennessee Eta chapter was founded on July 4, 1857, marking the fifth established chapter of Sigma Alpha Epsilon. Being the oldest existing fraternity on Union University's campus, TN Eta is rich with traditon dating back to its earliest years. Its members are involved on campus with leadership positons in Residence Advisors, LIFE groups, Postal Service, Student Government, and Global Opportunity trips. </p>
</div>
</body>
</html>
i can post css and image files if needed,
thanks again,
Jeff
CSS Codes
Reply With Quote
Bookmarks