3-level Chrome Menu(need help with a little tweaking)

[d4rk3l]

hello guys, i am new here and i'm not good at web design, and therefore i do most things by trial and error. while searching for a solution on this board, i saw justicefish's post, which sort of inspired me. with his idea, i proceeded to create another function below dropit.

dropright:function(obj, e, dropmenuID){
if (this.dropmenuobj!=null) //hide previous menu
this.dropmenuobj.style.visibility="hidden"
this.clearhidemenu() <-- red lines removed so 2nd level menu does not close
if (this.ie||this.firefox){
obj.onmouseout=function(){cssdropdown.delayhidemenu()}
this.dropmenuobj=document.getElementById(dropmenuID)
this.dropmenuobj.onmouseover=function(){cssdropdown.clearhidemenu()}
this.dropmenuobj.onmouseout=function(){cssdropdown.dynamichide(e)}
this.dropmenuobj.onclick=function(){cssdropdown.delayhidemenu()}
this.showhide(this.dropmenuobj.style, e, "visible", "hidden")
this.dropmenuobj.x=this.getposOffset(obj, "left")
this.dropmenuobj.y=this.getposOffset(obj, "top")
this.dropmenuobj.style.left=this.dropmenuobj.x-this.clearbrowseredge(obj, "rightedge")+obj.offsetWidth+1+"px"
this.dropmenuobj.style.top=this.dropmenuobj.y-this.clearbrowseredge(obj, "bottomedge")+obj.offsetHeight-23+"px"
}
},

and this is my html code

<div id="chromemenu">
<ul>
<li><a href="http://www.dynamicdrive.com">Home</a></li>
<li><a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu1')">Resources</a></li>
<li><a href="#" onMouseover="cssdropdown.dropit(this,event,'dropmenu2')">News</a></li>
<li><a href="http://cnn.com" onMouseover="cssdropdown.dropit(this,event,'dropmenu3')">Search</a></li>	
</ul>
</div>
                                       
<div id="dropmenu1" class="dropmenudiv">
<a href="http://www.dynamicdrive.com/">Dynamic Drive</a>
<a href="http://www.cssdrive.com">CSS Drive</a>
<a href="http://www.javascriptkit.com">JavaScript Kit</a>
<a href="http://www.codingforums.com">Coding Forums</a>
<a href="http://www.javascriptkit.com/jsref/">JavaScript Reference</a>
<a href="#" onMouseover="cssdropdown.dropright(this,event,'dropmenu4')">DUMMY ></a>
</div>

<div id="dropmenu4" class="dropmenudiv" style="width: 150px;">
<a href="http://www.google.com/">Google</a>
<a href="http://www.yahoo.com">Yahoo</a>
<a href="http://www.msn.com">MSN</a>
</div>

which allows all 3 level of menus to be opened quite nicely, with the 3rd level menu opening on the right. just that it creates problems like the 2nd level menu wont close even after our mouse left the 3rd level menu.

if anyone has any ideas would you pls help me out? thank you very much..

[benslayton]

could you post the url please?