Anylink CSS not working in IE

[Pfuse]

1) Script Title: AnyLink CSS

2) Script URL (on DD):

http://www.dynamicdrive.com/dynamici...anylinkcss.htm

3) Describe problem: Hi all, thanks in advance for the help. The page in quesion is;

http://www.moorepet.com/articles.asp?ID=7

If you were to open this in IE, you would notice that the text in the "Pet Door Navigation Menu" seems to be a simple link. If you open it in FF, you will see what it truly is, an implementation of AnyLink CSS.

My step by step thought process when trying to diagnose this was;


1)This has to be an IE problem since it works in FF, and MS did an update that seemed to screw up active content.

2)But when I visited the original script on the dynamic drive site in IE, it works fine. So it must have been something I did.

3)Have I done anything to alter the code since it last worked? No. I even compared the code, anylink.css, and anylink.js line for line and all seemed the same.

4)I don't know enough about JS or CSS to figure this out...but I know who can...

Any help would be greatly appreciated.

[iwdynamic]

The links look fine on my IE(version 6.02)

[Pfuse]

And they expand like they are supposed to?

[iwdynamic]

Sorry I was looking at the wrong part of the page.

[jscheuer1]

It is a conflict with the milonic_src.js script that you have linked to your page. It defines ie5 (one of the variables used by anylink.js) differently than anylink.js and, since it comes after anylink.js on the page, this is causing the problem. Rather than mess with milonic_src.js which is more complex than anylink.js, required for your other menu and that might be broken by editing of even an innocent variable name due to its copyright protection scheme. Let's change anylink.js, use this version (identical in every way except that all instances of 'ie5' have been changed to 'ie5a':

var disappeardelay=250  //menu disappear speed onMouseout (in miliseconds)
var enableanchorlink=0 //Enable or disable the anchor link when clicked on? (1=e, 0=d)
var hidemenu_onclick=1 //hide menu when user clicks within menu? (1=yes, 0=no)

/////No further editting needed

var ie5a=document.all
var ns6=document.getElementById&&!document.all

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){
if (ie5a||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-500
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=ie5a && !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=ie5a && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie5a && !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 dropdownmenu(obj, e, dropmenuID){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
if (typeof dropmenuobj!="undefined") //hide previous menu
dropmenuobj.style.visibility="hidden"
clearhidemenu()
if (ie5a||ns6){
obj.onmouseout=delayhidemenu
dropmenuobj=document.getElementById(dropmenuID)
if (hidemenu_onclick) dropmenuobj.onclick=function(){dropmenuobj.style.visibility='hidden'}
dropmenuobj.onmouseover=clearhidemenu
dropmenuobj.onmouseout=ie5a? function(){ dynamichide(event)} : function(event){ dynamichide(event)}
showhide(dropmenuobj.style, e, "visible", "hidden")
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 ((ie5a||ns6) && !enableanchorlink) 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 (ie5a&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}

function delayhidemenu(){
delayhide=setTimeout("dropmenuobj.style.visibility='hidden'",disappeardelay)
}

function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}

[Pfuse]

Wow! Total noob mistake. I am especially ashamed since I read the FAQ about why javascripts don't play nice together on the same page directly before my original post. Thank you very much. As an aside, can you recommend some reading for the total noob? I need to get better at this and I'm not above reading "Javascript for the Impatient" or whatever it may be.

Thanks again,

Chris