Задержка выпадения горизонтального меню. Нужна помощь

[cookoo]

Добрый день

 

opencart 1.5.4

сайт: smartpuls.com.ua

 

Хочу реализовать задержку выпадения горизонтального меню, тк в моем случае резко выпадающее меню приводит к отказу (уход с сайта)

Добавил  transition, opacity и visibility в файл stylesheet.css :

#menu > ul > li > div {
  /* display: none; */ /* отключил, иначе не срабатывает задержка */
  position: absolute;
  z-index: 5;
  padding: 35px 10px 31px 26px;
  background: #6b2b77;
  
  -webkit-transition: all .5s step-end; /* задержка */
  -moz-transition: all .5s step-end; /* задержка */
  -ms-transition: all .5s step-end; /* задержка */
  -o-transition: all .5s step-end; /* задержка */
  opacity: 0; /* не видно выпадающее меню */
  visibility: hidden; /* не видно выпадающее меню */


  width: 1164px;
  left: 5px;
  overflow: hidden;
  box-shadow: inset 0px 3px 1px rgba(95,41,108,0.9);
  -moz-box-shadow: inset 0px 3px 1px rgba(95,41,108,0.9);
  -webkit-box-shadow: inset 0px 3px 1px rgba(95,41,108,0.9);
  border-radius: 0 0 3px 0;  }

В этом же файле в hover добавил opacity и visibility:

#menu > ul > li:hover > div {
   opacity: 1; /* видно выпадающее меню */
   visibility: visible; /* не видно выпадающее меню */
   /* display: table; */ /* отключил, иначе не срабатывает задержка */  }

При чем свойство display отключил т.к. не срабатывает задержка если оно включено

 

в итоге получается следующее:

http://prntscr.com/a57r0o - первая категория выпадает с задержкой как надо

http://prntscr.com/a57r9t - вторая категория выпадает с задержкой, но в ней происходит сдвиг влево подкатегорий 3 уровня

http://prntscr.com/a57rn5 - третья категория выпадает с задержкой, сдвиг еще больше, в следующих категориях сдвиг увеличивается

http://prntscr.com/a57rvm - в последней категории сдвигается очень далеко

 

Вопрос в том, как убрать этот сдвиг подкатегорий? возможно есть другое решение с помощью css?

 

файл stylesheet.css

#menu > ul > li > div > ul ul li a {
  font-size: 12px; /* происходит сдвиг */  }

 

[cookoo]

Решено

 

тему можно закрыть