
var delay = 300; //Задержка перед началом движения меню обратно(в мс)
var delayMove=10; //Задержка смещения меню на step пикселей(в мс)
var tim;          //Идентификатор таймера
var curDivID=null;//Активный слой
var divTop;       //Y-координата верхнего угла слоя
var clipTop;      //Высота отсекаемой части слоя
var step=16;       //Величина смещения слоя за время delayMove в px
var st;           //|st|=step, а знак зависит от направления движения меню: "+" - вниз, //"-" - вверх
var up=0;         //Направление движения меню(0 - вниз; 1 - вверх)
var isShowing=0; //Состояние меню(0 - не отображено; 1 - отображено)
var startHide=0; //Положение курсора мыши(0 - в пределах меню - его не нужно //закрывать; 1 - за пределами меню - его нужно закрыть)

/* Показать меню
Выполняется каждый раз при наведении курсора мыши на элемент главного меню
el - элемент меню вызвавший событие
divID - идентификатор слоя(подменю), который необходимо отобразить
*/

function showMenu(el, divID){
  if (curDivID!=null && divID!=curDivID){
      clearTimeout(tim);
      isShowing = 0;
      curDivID.style.display="none";
  }
  curDivID = divID; //Запоминаем активное меню
  cancelHide();     //Отменяем функцию сокрытия меню
  startHide=0;     
  up=0;    
  if (!isShowing){//Меню не отображено
    isShowing = 1;
    curDivID.style.display = "block";
    clipTop = curDivID.offsetHeight;    
    divTop  = el.offsetTop+el.offsetHeight - curDivID.offsetHeight;
    curDivID.style.left = el.offsetLeft;
    moveMenu();
  }
}
/* Убрать меню
Выполняется каждый раз при покидании курсором мыши элементов, как главного меню, так и подменю
*/
function hideMenu(){
  if (clipTop==0){ //меню полностью отображено
    up=1;
    tim = setTimeout("moveMenu()", delay);
  }else startHide=1;
}
/* Отменить сокрытие меню
Отменяем действия вызванные функцией hideMenu 
*/
function cancelHide(){
  if (clipTop==0) //меню полностью отображено
    clearTimeout(tim);
  else startHide = 0;
}
/* Перемещение меню
Реализация движения меню
*/
function moveMenu(){
  if (!up) st = step; //движение меню вниз
  else st = -step;    //движение меню вверх
  divTop += st;
  clipTop -= st;
  if (clipTop<0){ divTop+=clipTop; clipTop=0}
  curDivID.style.top = divTop;
  curDivID.style.clip = "rect(" + clipTop +"px auto auto auto)";
  if (clipTop==0){ //меню полностью отображено
    up = 1;
    if (startHide) tim = setTimeout("moveMenu()", delay);
    return;
  } 
  if (clipTop>=curDivID.offsetHeight){ //меню полностью скрыто
    startHide = 0;
    isShowing = 0;
    return;
  }   
  tim = setTimeout("moveMenu()", delayMove);
}

