var delay = 500; //Задержка перед началом движения меню обратно(в мс)

var delayMove=10; //Задержка смещения меню на step пикселей(в мс)

var tim;          //Идентификатор таймера

var curDivID=null;//Активный слой

var divTop;       //Y-координата верхнего угла слоя

var clipTop;      //Высота отсекаемой части слоя

var step=2;       //Величина смещения слоя за время delayMove в px

var st;           //|st|=step, а знак зависит от направления движения меню: "+" - вниз, //"-" - вверх

var up=0;         //Направление движения меню(0 - вниз; 1 - вверх)

var isShowing=0; //Состояние меню(0 - не отображено; 1 - отображено)

var startHide=0; //Положение курсора мыши(0 - в пределах меню - его не нужно //закрывать; 1 - за пределами меню - его нужно закрыть)

function showMenu(el, divID){

  divID = document.getElementById(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.toString() + 'px';

    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.toString() + 'px';

  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);

}
