@Para_Lapok

Как сделать так, чтобы элемент отображался и скрывался когда нужно?

Мне нужно, чтобы при наведении на пункт одного меню появлялось другое меню под ним. При наведении на это другое меню нужно, чтобы оно не исчезало, пока я не уберу курсор с этого другого меню. Делаю всё при помощи jQuery.
Строение меню:
<!-- Основное меню -->
<nav class="main_menu">
  <input type="checkbox" name="menu" id="btn-menu" />
  <label for="btn-menu"><img src="https://img.icons8.com/ios/50/000000/menu--v1.png" width="30"></label>
  <ul>
    <li class=" zero_li">
      <a href="https://sigma.irksite.ru/"><img src="/upload/landing/955/Bezymyannyy_1x_1x.png" class="logo" width="70" style="margin-bottom: 0px;"></a>
    </li>
    <li class="one_li">
      <a href="https://sigma.irksite.ru/okompanii/" id="company">Компания</a>
    </li>
    <li class="two_li">
      <a href="https://sigma.irksite.ru/proekty/" id="projects">Проекты</a>
    </li>
    <li class="three_li">
      <a href="https://sigma.irksite.ru/pustayastranitsa/" id="investors">Инвесторам</a>
    </li>
    <li class="four_li">
      <a href="https://sigma.irksite.ru/sotsialnayaotvetstvennost/" id="responsibility">Ответственность</a>
    </li>
    <li class="five_li">
      <a href="https://sigma.irksite.ru/press-center/" id="press-center">Пресс-центр</a>
    </li>
    <li class="six_li">
      <a href="https://sigma.irksite.ru/for-partners/" id="partners">Партнёрам</a>
    </li>
    <li class="seven_li">
      <a href="https://sigma.irksite.ru/kontakty/" id="kontacts">Контакты</a>
    </li>
  </ul>
</nav>
<!-- 1-е подменю -->
<nav class="company">
  <ul class="nav">
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/okompanii/#block347">История</a>
    </li>
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/okompanii/#block363">Структура</a>
    </li>
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/okompanii/#block371">Совет директоров</a>
    </li>
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/okompanii/#block654">Менеджмент</a>
    </li>
  </ul>
</nav>
<!-- 2-е подменю -->
<nav class="projects">
  <ul class="nav">
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/pustayastranitsa3/">Геология и запасы</a>
    </li>
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/pustayastranitsa5/">Горные работы</a>
    </li>
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/pustayastranitsa6/">Обогащение</a>
    </li>
    <li class="nav-item">
      <a class="under_menu" href="https://sigma.irksite.ru/pustayastranitsa7/">Программа развития</a>
    </li>
  </ul>
</nav>

Проблема в том, что когда я прописываю mouseout для nav - меню исчезает когда я навожу курсор на ссылки. Когда прописываю это же событие для ссылок - нет возможности перевести курсор с одной ссылки на другую, меню исчезает. Думала попробовать условием, где проверялось бы это событие и для меню и для ссылок, но не знаю как правильно прописать это условие. Пробовала обернуть второе меню в div и его отслеживать - не помогло. Хотела попробовать с координатами - не знаю как в условии сравнить то, что курсор выше или ниже/левее или правее заданных координатов.
P.S.: прописала в коде 2 подменю, всего их для каждого пункта в основном меню.
  • Вопрос задан
  • 45 просмотров
Решения вопроса 1
@Para_Lapok Автор вопроса
Нашла ещё один способ и остановилась на нём - проверяю ни когда курсор уберу с меню, а когда наведу его на div. Всё работает как надо.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@Evdokim001
PHP & WordPress developer
Это не разные меню. Все нужно соединить в одно меню.
<ul>
  <li>
   Menu
  </li>
  <ul>
     <li>
         Podmenu
      </li>
  </ul>
</ul>

А с помощью jQuery задать при наведении на пункт меню открыть то подменю которое находится ближе всех.
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы