Forum Moderators: open

Message Too Old, No Replies

Why isn't my link working?

Within my javascript dropdown menu

         

Rightz

7:55 am on Jun 20, 2006 (gmt 0)

10+ Year Member



I've got a js dropdown menu. The menu works fine, but the I can't get the link at the header of each dropdrop section to work. Say you've got A, B, and C showing on your page. When you roll over either A, B or C the menu boxes drop down. The links on the drop down sections work but I cant A, B or C links to work.

Could anyone give me some advice?

Here is the code on my page:

<a href="cant get this to work.html" onClick="return clickreturnvalue()" onMouseover="dropdownmenu(this, event, menu2, '150px')" onMouseout="delayhidemenu()">Link A</a>

Here is the js:

<!--

//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href=http://www.example.com>Exhanging Currency</a>'
menu1[1]='<a href=http://www.example.com>Health</a>'
menu1[2]='<a href=http://www.example.com>Money</a>'

//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href=http://www.example.com>Travel Books</a>'
menu2[1]='<a href=http://www.example.com>Travel Insurance</a>'
menu2[2]='<a href=http://www.example.com>Visa Information</a>'

//Contents for menu 3, and so on
var menu3=new Array()
menu3[0]='Coming Soon'

//Contents for menu 4, and so on
var menu4=new Array()
menu4[0]='Coming Soon'

//Contents for menu 5, and so on
var menu5=new Array()
menu5[0]='Coming Soon'

var menuwidth='165px' //default menu width
var menubgcolor='#CC0000' //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

function MM_jumpMenu( targ, selObj, restore )
{ //v3.0
eval( targ + ".location='" + selObj.options[ selObj.selectedIndex ].value + "'" ) ;
if ( restore )
selObj.selectedIndex = 0 ;
}

//-->

Rightz

9:23 am on Jun 20, 2006 (gmt 0)

10+ Year Member



I was thinking maybe it was something to do with this code:

if (hidemenu_onclick=="yes")
document.onclick=hidemenu

you think?

Rightz

1:41 pm on Jun 20, 2006 (gmt 0)

10+ Year Member



Anyone?!

jshanman

1:55 pm on Jun 20, 2006 (gmt 0)

10+ Year Member



function clickreturnvalue(){
if (ie4¦¦ns6) return false
else return true
}

if this returns false, then the click is ignored by the anchor and the link is not followed.

ie4 will be true for any version of IE and some versions of Opera
ns6 wil be true for most versions of mozilla/firefox/netscape

-JS

Rightz

2:53 pm on Jun 20, 2006 (gmt 0)

10+ Year Member



Would I delete this bitof code then? Or would I change it to:

function clickreturnvalue(){
if (ie4¦¦ns6) return true
else return true
}

?

jshanman

5:34 pm on Jun 20, 2006 (gmt 0)

10+ Year Member



<a href="cant get this to work.html" onMouseover="dropdownmenu(this, event, menu2, '150px')" onMouseout="delayhidemenu()">Link A</a>

Just remove the onclick function altogether, and the link will work like a normal link with a fancy mouseover...

- JS

Rightz

8:06 pm on Jun 20, 2006 (gmt 0)

10+ Year Member



That works brilliantly - thanks very much :)