Using images instead of text for AnyLink CSS anchors

[amateur6]

1) AnyLink CSS Menu

2) http://www.dynamicdrive.com/dynamicindex1/anylinkcss.htm

My URL: http://www.sullivanandco.com/test/pfp/test3.htm (only first item has a drop-down menu)

3) I chose to modify this menu to work with images as anchors instead of text; used CSS to swap images. Brilliant so far. Only question: is there an easy way I can make the mouseover of the menu tell the header image to stay in "highlight" mode? Or should I use another script instead of the AnyLink one?

Many thanks in advance! :cool:

[jscheuer1]

Here's a fairly easy method. Add only this to your current styles:


ul#menu li a:hover, .activetrigger {background-position:0 -27px!important;}

Then in the script add:


function dropdownmenu(obj, e, dropmenuID){
if(dropdownmenu.last)
dropdownmenu.last.className = '';
dropdownmenu.last = obj;
obj.className = 'activetrigger';
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
if (typeof dropmenuobj!="unde . . .

and:


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

While you're at it, might as well take care of this minor error in the script too (add the red parts):


function showhide(obj, e, visible, hidden){
if (ie5||ns6)
dropmenuobj.style.left=dropmenuobj.style.top="-500px";
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}

[amateur6]

Fantastic; that worked a treat!

Many thanks. :D