$(document).ready( function() {
	
	$('.Block.CanHover').bind('mouseenter', function() {
		$(this).addClass('Hover');
	}).bind('mouseleave', function() {
		$(this).removeClass('Hover');
	});
	
	
	$('.Items').bind('mouseenter', function() {
		openMenu(this.id);
	}).bind('mouseleave', function() {
		closeMenu(this.id);
	});
	
});

function openMenu(ItemID) {
	//Hij is dicht, dus opendoen
	var Item = $('#' + ItemID );
	var UL = $('#' + ItemID + ' ul');
	
	var Height = $(UL).attr("scrollHeight");
	Height = Height >= 40 ? Height : 40;
	
	$(UL).animate({
		height: Height
	}, { 
		duration: 500, 
		queue: false,
		complete: function() {
			$(this).addClass('Hover');
		}
	});
	
	$(Item).animate({
		backgroundPosition: '0px -130px'
	}, { 
		duration: 500, 
		queue: false,
		complete: function() {
			$(this).addClass('Hover');
		}
	});
}

function closeMenu(ItemID) {
	//Hij is open, dus dichtdoen
	var Item = $('#' + ItemID );
	var UL = $('#' + ItemID + ' ul');
	
	$(UL).animate({
		height: 40
	}, { 
		duration: 500, 
		queue: false,
		complete: function() {
			$(this).addClass('Hover');
		}
	});
	
	$(Item).animate({
		backgroundPosition: '0px -0px'
	}, { 
		duration: 500, 
		queue: false,
		complete: function() {
			$(this).removeClass('Hover');
		}
	});
}
