I wrote this code and I can't get it disappear on mouseout..

<script language="javascript" type="text/javascript">
	var activeLayer = "0";
	function highlight(theLayer)
		{				
			highlighter = document.all? document.all[theLayer] : document.getElementById? document.getElementById(theLayer) : ""		
		}
	function lowlight(theLayer)
		{					
			lowlighter = document.all? document.all[theLayer] : document.getElementById? document.getElementById(theLayer) : ""		
		}
	function JumpToNav(navIndex)
		{
			newNav	= "NavMenu"+navIndex;
			newCon	= "NavContent"+navIndex;
			oldNav	= "NavMenu"+activeLayer;
			oldCon	= "NavContent"+activeLayer;
			newNavLayer	= document.all? document.all[newNav] : document.getElementById? document.getElementById(newNav) : ""		
			newConLayer	= document.all? document.all[newCon] : document.getElementById? document.getElementById(newCon) : ""		

			oldNavLayer	= document.all? document.all[oldNav] : document.getElementById? document.getElementById(oldNav) : ""		
			oldConLayer	= document.all? document.all[oldCon] : document.getElementById? document.getElementById(oldCon) : ""					
			
			oldConLayer.style.display="none";
			newConLayer.style.display="inline";	
			activeLayer = navIndex;
		}
		
	function buildObject(obj){
		document.write(obj)
	}
</script>

You apply the show hide like this:

<ul>
 <li id="NavMenu0" onmouseover="JumpToNav(0);"><a href="#nogo">1 - blah blah blah blah blah </a></li>
 <li id="NavMenu1" onmouseover="JumpToNav(1);"><a href="#nogo">2 - blah blah blah blah blah </a></li>
</ul>

The problem is when you mouseout any of the links the menu stays visible...

Can somebody help please?

Ted

You didn't post working code. Where is the content piece of html. I don't see where you are doing any onMouseOut or have not posted any code that would even begin to act like you say.

I tried the code. Removed all the javascript references to con. Then I realized what the code that was left does absolutly nothing.

I tried a onmouseout tag on the <li> tag and now you can't mouseover the popup...

<html>
<head>
<script language="javascript" type="text/javascript">
	var activeLayer = "0";
	function highlight(theLayer)
		{				
			highlighter = document.all? document.all[theLayer] : document.getElementById? document.getElementById(theLayer) : ""		
		}
	function lowlight(theLayer)
		{					
			lowlighter = document.all? document.all[theLayer] : document.getElementById? document.getElementById(theLayer) : ""		
		}
	function JumpToNav(navIndex)
		{
			newNav	= "NavMenu"+navIndex;
			newCon	= "NavContent"+navIndex;
			oldNav	= "NavMenu"+activeLayer;
			oldCon	= "NavContent"+activeLayer;
			newNavLayer	= document.all? document.all[newNav] : document.getElementById? document.getElementById(newNav) : ""		
			newConLayer	= document.all? document.all[newCon] : document.getElementById? document.getElementById(newCon) : ""		

			oldNavLayer	= document.all? document.all[oldNav] : document.getElementById? document.getElementById(oldNav) : ""		
			oldConLayer	= document.all? document.all[oldCon] : document.getElementById? document.getElementById(oldCon) : ""					
			
			oldConLayer.style.display="none";
			newConLayer.style.display="inline";	
			activeLayer = navIndex;
		}
		
	function buildObject(obj){
		document.write(obj)
	}
</script>
</head>
<body>
<div>
<ul>
 <li id="NavMenu0" onmouseover="JumpToNav(0);"><a href="#nogo">1 - blah blah blah blah blah </a></li>
 <li id="NavMenu1" onmouseover="JumpToNav(1);"><a href="#nogo">2 - blah blah blah blah blah </a></li>
</ul>
</div>
<div id="NavContent0" style="display:none; position:absolute; left:80px; top:80px; height:100px; width:100px; z-index:999;">1</div>
<div id="NavContent1" style="display:none; position:absolute; left:90px; top:80px; height:100px; width:100px; z-index:999;">2</div>
</body>
</html>