/**
 * Dropdown menu by 
 *	
 * This will use jquery to position the list under the menu item that the user hovers over.
 */

$(document).ready(function() {
	$('.mainNav').each(function(i, e){
		$(e).bind('mouseenter', {div: e}, showMenu);					
		$(e).bind('mouseleave', {div: e}, hideMenu);
	});
});

function showMenu(event)
{
	$(".dropdownList").css({ display: 'none' });
	
	var div = event.data.div;

	// Calculate position
	var offset = $(div).position(); // cum offset = offset in jquery
	
	if (jQuery.support.boxModel){
		var top = offset.top + 25;
	}else{
		var top = offset.top + 35;
	}
	
	var left = offset.left;
	
	var divId = $(div).attr('id');
	//console.log(divId);
	$("#" + divId + " .dropdownList").css({ top: top + 'px', left: left + 'px' });
	$("#" + divId + " .dropdownList").fadeIn("slow");
}

function hideMenu(event)
{
	var div = event.data.div;
	$(div).css({ backgroundColor: '#FFFFFF' });
	var divId = $(div).attr('id');
	$("#" + divId + " .dropdownList").css({ display: 'none' });
}