// Bind our event listeners
jQuery(document).ready(function()
{
    jQuery(".page_item").hover(highlightMenuItem, unHighlightMenuItem);
	jQuery(".page_item ul").addClass("sub_menu");
});


function highlightMenuItem(e) 
{
    var menuItem = jQuery(this);
    menuItem.addClass("highlight");
	jQuery(menuItem.children("a")[0]).css("color","white");
    var subMenu = menuItem.children("ul");
    if (subMenu != undefined && subMenu.length == 1) 
    {
		if(menuItem.parent().hasClass("sub_menu"))
		{
			var index = menuItem.parent().children().index(menuItem);
			showSubMenu(subMenu, index * menuItem.outerHeight(), menuItem.outerWidth());
		}
		else
		{
			var offset = menuItem.offset();
			showSubMenu(subMenu, offset.top, offset.left + menuItem.outerWidth() );
		}
    }
}

function unHighlightMenuItem(e) {
    var menuItem = jQuery(this);
    menuItem.removeClass("highlight");
	jQuery(menuItem.children("a")[0]).css("color","");
    var subMenu = menuItem.children("ul");
    if (subMenu != undefined && subMenu.length == 1) 
    {
		subMenu.fadeOut("fast");
    }
}

function showSubMenu(menu, top, left) 
{
    menu.css    ({
	position: "absolute",
    top: top + "px",
    left: left + "px"
    });
    menu.fadeIn("fast");
}