var loaderBlock = document.getElementById("menuLoaderBlock");

/*if (div.addEventListener)
  div.addEventListener ('load', 'initSubMenu', false);
else if (div.attachEvent)
  div.attachEvent ('onload', 'initSubMenu');
else
  div['onload'] = 'initSubMenu';*/

 window.onload = function(){
 	initSubMenu();
 } 

var count = 8;
var over = 0;
var idTimeout;

function initSubMenu(){
	for(i=1;i<count+1;i++){
		document.getElementById("menu"+i).num = i;
		document.getElementById("menu"+i).onmouseover = function(){
			doShow(this.num);	
		}
		document.getElementById("menu"+i).onmouseout = function(){
			doHide();	
		}
		
		document.getElementById("submenu"+i).num = i;
		document.getElementById("submenu"+i).onmouseover = function(){
			doShow(this.num);	
		}
		document.getElementById("submenu"+i).onmouseout = function(){
			doHide();	
		}
	}
}
function doShow(num){
	clearTimeout(idTimeout);
	var subBlock = document.getElementById("submenu"+num);
	for(i=1;i<count+1;i++){
		document.getElementById("submenu"+i).style.display = "none";
	}
	if(num != count && num != 1){
		subBlock.style.left = getElementPosition("menu"+num).left + "px";
	}
	else if(num == count){
		subBlock.style.left = getElementPosition("menu"+num).left - 70 + "px";
	}
	else if(num == 1){
		subBlock.style.left = getElementPosition("menu"+num).left + 15 + "px";	
	}
	subBlock.style.display = "block";
	over = 1;
}
function doHide(){
	over = 0;
	idTimeout = setTimeout(checkHide, 2000);
	function checkHide(){
		if(over != 1){
			for(i=1;i<count+1;i++){
				document.getElementById("submenu"+i).style.display = "none";
			}	
		}
	}	
}
function getElementPosition(elemId){
    var elem = document.getElementById(elemId);
	
    var w = elem.offsetWidth;
    var h = elem.offsetHeight;
	
    var l = 0;
    var t = 0;
	
    while (elem)
    {
        l += elem.offsetLeft;
        t += elem.offsetTop;
        elem = elem.offsetParent;
    }

    return {"left":l, "top":t, "width": w, "height":h};
}