Задать вопрос
@hello-world-1

Как исправить исчезновение выпадающего меню при наведение?

Здравствуйте. Есть проблема с отображение выпадающего меню. При наведение на элемент «Меню», открывает подменю, которое закрывается, когда курсор покидает элемент «Меню». Как это исправить?

Прикладываю пример - https://jsfiddle.net/nqzf50wo/1/
  • Вопрос задан
  • 64 просмотра
Подписаться 1 Средний Комментировать
Решения вопроса 1
@MikUrrey
Приветствую!
Убрать
.nav-head:hover ~ .nav-submenu {
  display: block
}

и вместо него прописать
.nav-item:hover .nav-submenu {
  display: block
}

https://jsfiddle.net/puwkmv20/

С таким селектором .nav-head:hover ~ .nav-submenu, когда вы уводите курсор на .nav-submenu, .nav-item больше не :hover, и поэтому .nav-submenu больше не display: block (скрывается).

С .nav-item:hover .nav-submenu, уводя курсор на .nav-submenu, мы всё еще держим :hover на .nav-item, потому что .nav-submenu его потомок.
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы