$(document).ready(function(){
	
		// remove link background images since we're re-doing the hover interaction below 
		// (doing it this way retains the CSS default hover states for non-javascript-enabled browsers)
		// we also want to only remove the image on non-selected nav items, so this is a bit more complicated
		$(".dropdown").children("li").each(function() {
			var current = "dropdown current-" + ($(this).attr("class"));
			var parentClass = $(".dropdown").attr("class");
			if (parentClass != current) {
				$(this).children("a").css({backgroundImage:"none"});
			}
		});	


		// create events for each nav item
		attachNavEvents(".dropdown", "home");
		attachNavEvents(".dropdown", "profilo");
		attachNavEvents(".dropdown", "prodotti");
		attachNavEvents(".dropdown", "news");
		attachNavEvents(".dropdown", "press");
		attachNavEvents(".dropdown", "tecnico");
		attachNavEvents(".dropdown", "offerte");
		attachNavEvents(".dropdown", "gallery");
		attachNavEvents(".dropdown", "contatti");
	

		function attachNavEvents(parent, myClass) {
			$(parent + " ." + myClass).mouseover(function() {
				$(this).append('<div class="dropdown-' + myClass + '"></div>');
				$("div.dropdown-" + myClass).css({display:"none"}).fadeIn(0);
			}).mouseout(function() {
				$("div.dropdown-" + myClass).fadeOut(300, function() {
					$(this).remove();
				});
			}).mousedown(function() {
				$("div.dropdown-" + myClass).attr("class", "dropdown-" + myClass + "-click");
			}).mouseup(function() {
				$("div.dropdown-" + myClass + "-click").attr("class", "dropdown-" + myClass);
			});
		}
			$(function(){

				$("ul.dropdown li").hover(function(){
				
					$(this).addClass("hover");
					$('ul:first',this).css('display', 'block');
				
				}, function(){
				
					$(this).removeClass("hover");
					$('ul:first',this).css('display', 'none');
				
				});
				
				

			});

});
