/*
	This short and to the point script has been written by Survice.
	The point of it is to display the nested ul list that is inside parent page <li>
	when you mouse over the parent the list shows up and when you mouseout the list dissappear
*/

window.onload = activateHoverMenu;

function activateHoverMenu()
{	
	// This gets all the li's of the ul#nav element
	var oNavMenu = document.getElementById('nav').getElementsByTagName('LI');
	
	// For each child we identify the "parent" by it having the class parent in it
	for( var i=0; i < oNavMenu.length; i++ )
	{
		if( oNavMenu[i].className.indexOf('top') > 0 )
		{
			// Do we have a child UL element ? only then do we assign the events
			if( oNavMenu[i].getElementsByTagName('UL')[0] )
			{
				oNavMenu[i].onmouseover = function() 
				{
					this.getElementsByTagName('UL')[0].style.visibility = 'visible';
					this.getElementsByTagName('UL')[0].onmouseout = function() { this.style.visibility = 'hidden';	}
				}
				
				oNavMenu[i].onmouseout = function()	{this.getElementsByTagName('UL')[0].style.visibility = 'hidden';}
			}
		}
	}
}