Problem with onmouseover

[jtb___btj]

I am new to javascript. I am using two scripts: first one is a mouseover image on/off switcher, other one opens up a submenu. Everything works fine until I take the pointer off the link. Submenu closes like it should, but for some reason picture doesn't change back to the normal state.

Submenu script I am using is this
http://www.dynamicdrive.com/dynamici...nylinkcss2.htm
More precisely, I suppose the base of the problem lies in this file
http://www.dynamicdrive.com/dynamici...inkvertical.js

mouseover script simply is

<Script language="JavaScript">
if (document.images)
{
	image0 = new Image(172,24);
	image0.src = "k/example-on.gif";
}
</script>

My html looks like

<!-- menulink1 -->
<a href="example.html" 
onmouseover="image0.src='k/example-on.gif', dropdownmenu(this, event, 'anylinkmenu1');" 
onmouseout="image0.src='k/example-off.gif';">
<img src="k/example-off.gif" id="image0" name="image0" /></a>

<!-- submenu -->
<div id="anylinkmenu1" class="anylinkcss">
<a href="link1.html">link1</a>
<a href="link2.html">link2</a>
</div>

Any help appreciated!

[jscheuer1]

This solution isn't ideal because it attaches a script property to the page element in IE to prevent attaching the event more than once (which would lead to excessive memory usage in IE, if not prevented in some way), but it should (untested) work out fine in almost all cases. Replace:

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 (ie5||ns6){
obj.onmouseout=delayhidemenu
dropmenuobj=document.getElementById(dropmenuID)
if (hidemenu_onclick) dropmenuobj.onclick=function(){dropmenuobj.style.visibility='hidden'}
dropmenuobj.onmouseover=clearhidemenu
dropmenuobj.onmouseout=ie5? 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")+obj.offsetWidth+horizontaloffset+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"px"
}
return clickreturnvalue()
}

with:

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 (ie5||ns6){
if(window.addEventListener)
obj.addEventListener('mouseout', delayhidemenu, false);
else if(window.attachEvent&&!obj.added){
obj.attachEvent('onmouseout', delayhidemenu);
obj.added=1;
}
else
obj.onmouseout=delayhidemenu
dropmenuobj=document.getElementById(dropmenuID)
if (hidemenu_onclick) dropmenuobj.onclick=function(){dropmenuobj.style.visibility='hidden'}
dropmenuobj.onmouseover=clearhidemenu
dropmenuobj.onmouseout=ie5? 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")+obj.offsetWidth+horizontaloffset+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+"px"
}
return clickreturnvalue()
}

[jtb___btj]

Cheers John, it seems to work well in Firefox (1.5), however IE 6.0 is acting somewhat interestingly. First time around everything is fine, but if I - without clicking any link - try to open the submenu for the second time, it vanishes quickly after a few milliseconds. More interestingly, it also loses the mouseover function, so it doesn't return to normal state from the "hover" onmouseover state.

It is all too complicated for me to figure out since I have virtually zero experience with javascript. I curse the people who took me by suprise for suddenly wanting a submenu, which never was to be implemented in the first place since it makes this particular site hard to use & understand - everything I tried to avoid, since making site more user friendly and usable was the original reason for relayout.

[jscheuer1]

Can you provide a link to your problem page?

[jtb___btj]

Sure,

it's http://jh.werk23.org/misc/isytemp/

Links "Toiminta" and "Savunmittaajista..." are the ones with the submenu scripts.

Thanks!

[jscheuer1]

I made an error in logic, it should have been:

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 (ie5||ns6){
if(window.addEventListener)
obj.addEventListener('mouseout', delayhidemenu, false);
else if(window.attachEvent&&!obj.added){
obj.attachEvent('onmouseout', delayhidemenu);
obj.added=1;
}
else if(!window.addEventListener&&!window.attachEvent)
obj.onmouseout=delayhidemenu
dropmenuobj=document.getElementById(dropmenuID)
if (hidemenu_onclick) . . .

I also noticed that you had this:

<script type="text/javascript" src="anylink.js">

/***********************************************
* AnyLink CSS Menu script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
	<script type="text/javascript" src="anylink.js">

/***********************************************
* AnyLink CSS Menu script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

in your head section. The script should only be linked once.