No replies
Maverick
Offline
newbie
Scotland
Last seen: 17 years 41 weeks ago
Scotland
Joined: 2004-08-03
Posts: 10
Points: 0

hey everyone..We just finished the modifications to our new site and its CSS powered but there is a problem...

my co worker has done something to the css and hes killed the DHTML menu (well not killed it ..it rather un-happily 'times out' after you place the cursor over the list itself...)

its on our testing server but here is the original code for the drop down menu part (with javascript code)

#navigate	{	
				width: 700px;
				height: 22px;
				margin: 0 0;
				background: #0099ff;
				}

/* secondary css menu style for DHTML menus */

ul 			{ 	margin: 0px; 
				list-style: none; 
				}
				
li 			{ 	float: left; 
				position: relative; 
				width: 140px; 
				background:  #0099ff;
				padding: 0px; 
				/*left: 40px;*/
				}
				
/* 2nd level listings */
li ul 		{	display: none; 
				position: absolute; 
				top: 22px; 
				left: 0px; 
				width: 140px; 
				display: none;
				}
				
ul li a 	{ 	display: block; 
				text-decoration: none; 
				color: #fff; 
				background:  #0099ff;
				padding: 5px;
				}
				
li>ul 		{ 	top: auto; 
				left: auto;
				}
				
/* display menus */
li:hover ul, li.over ul {display: block;}

 <!-- java script code is below -->

startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace
	(" over", "");
   }
   }
  }
 }
}
window.onload=startList;

thats the ORIGINAL code...

now heres my colleagues modified code..can anyone help spot the trouble??

/* secondary css menu style for DHTML menus */

div.navi ul 	{
				 	margin: 0px; 
					list-style: none; 
				}
div.navi li 	{ 	
					float: left; 
					position: relative; 
					width: 95px; 
					padding: 0px; 
					left: 160px;
				}
				
/* 2nd level listings */

div.navi li ul 	{
					display: none; 
					position: absolute;
					left: -160px;
					width: 95px; 
					text-align: left;		
				}
				
div.navi ul li a { 	
					display: block; 
					text-decoration: none; 
					color: #FFFFFF; 
					background: transparent; 
					padding: 5px;
				}				
div.navi li ul  a { 
					text-decoration: none; 
					color: #FFFFFF; 
					background: #FF9900; 
					padding: 5px;
				}				
div.navi li>ul 	{ 	
					top: auto; 
					left: auto;
				}
				
/* display menus */
div.navi li:hover ul, div.navi li.over ul {
					display: block;
}

<!-- the javascript is the same as the original version-->

mightily challenge is this..all help is appreciated

Thanks