Element.addMethods({
    onmouseenter: function(element,observer) {
        element = $(element);
        element.observe('mouseover',function(evt,currentTarget) {
            var relatedTarget = $(evt.relatedTarget || evt.fromElement);
            if( relatedTarget!=currentTarget && relatedTarget.childOf(currentTarget)==false ) {
                observer();
            } 
        }.bindAsEventListener({},element));
        return element;
    },
    onmouseleave: function(element,observer) {
        element = $(element);
        element.observe('mouseout',function(evt,currentTarget) {
            var relatedTarget = $(evt.relatedTarget || evt.toElement);
            if( relatedTarget!=currentTarget && relatedTarget.childOf(currentTarget)==false ) {
                observer();
            } 
        }.bindAsEventListener({},element));
        return element;
    }
});

var menutabdelay = 500;

function visible(menutabnumber){
	$$('#navpassion li:nth-child('+menutabnumber+') ul').each(function(element) {
		$(element).setStyle('visibility: visible;');
	});
}

function showsubmenu(element, menutabnumber){

	Event.observe(element, 'mouseenter', function(){ // IE
		tempsIE = setTimeout(function(){visible(menutabnumber)}, menutabdelay);
	});
	
	Element.onmouseenter(element,function(){ // No IE
			temps = setTimeout(function(){visible(menutabnumber)}, menutabdelay);
		});

	Event.observe(element, 'mouseleave', function(){ // IE
		clearTimeout(tempsIE);
		$$('#navpassion li ul').each(function(element) {
			$(element).setStyle('visibility: hidden;');
		});
	});
	
	Element.onmouseleave(element,function(){ // No IE
		clearTimeout(temps);
		$$('#navpassion li ul').each(function(element) {
			$(element).setStyle('visibility: hidden;');
		});
	});

}

function showsubmenutrigger() {
	for (i=1; i<=3; i++) {
		$$('#navpassion li.red:nth-child('+i+')').each(function(element) {
			var menutabnumber = i;
			showsubmenu(element, menutabnumber);
		});
	}
	for (i=4; i<=7; i++) {
		$$('#navpassion li.orange:nth-child('+i+')').each(function(element) {
			var menutabnumber = i;
			showsubmenu(element, menutabnumber);
		});
	}
	
	$$('#navpassion li.blue:nth-child(8)').each(function(element) {
		var menutabnumber = '8';
		showsubmenu(element, menutabnumber);
	});
	
	$$('#navpassion li.bluecourt:nth-child(9)').each(function(element) {
		var menutabnumber = '9';
		showsubmenu(element, menutabnumber);
	});
}

Event.observe(window, 'load', showsubmenutrigger);