Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Переключение видимости ul ul (https://javascript.ru/forum/jquery/55409-pereklyuchenie-vidimosti-ul-ul.html)

ufaclub 26.04.2015 20:21

Переключение видимости ul ul
 
структура меню

<ul class="main-menu">

<li class="active">
<a class="selected" href="">Леса</a>
<ul class="main-menu">
<li><a href="">Леса клиновые</a></li>
<li><a href="">Леса рамные</a></li>
<li><a href="">Леса хомутовые и штыревые</a></li>
</ul>					
</li>
											
<li><a href="">Вышки-тур</a>
<ul class="main-menu">
<li><a  href="">Вышки-тур резервуарные</a></li>
</ul>
</li>

</ul>



сейчас 2 уровень вложенности скрыт вот так:

.main-menu li ul {display:none;}
.main-menu li:hover ul {display:block;}


Хочу сделать так чтобы видимостью управлял именно jq.

Только функция не ховер. А по другому.

При наведение на какой либо <li> внутри которого есть второй уровень - этот второй уровень становился видимый. и если мышку в сторону отвести то он не закрывался бы. А лишь только тогда бы закрывался когда курсор перейдет на другой <li> у которого есть вложенный <ul>

рони 26.04.2015 20:42

Открывашка 215 для соседних Li в меню
 
ufaclub,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

.main-menu > li > ul {display:none;}


.main-menu > li.active > ul {display:block;}

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
       var li = $(".main-menu").parent('li');
       li.mouseenter(function() {
         li.not(this).removeClass("active");
         $(this).addClass("active");
      });
});


  </script>
</head>

<body>
<ul class="main-menu">
<li class="active">
<a class="selected" href="">Леса</a>
<ul class="main-menu">
<li><a href="">Леса клиновые</a></li>
<li><a href="">Леса рамные</a></li>
<li><a href="">Леса хомутовые и штыревые</a></li>
</ul>
</li>
<li><a href="">Вышки-тур</a>
<ul class="main-menu">
<li><a  href="">Вышки-тур резервуарные</a></li>
</ul>
</li>
</ul>
</body>

</html>

ufaclub 26.04.2015 20:50

спасибо!


Часовой пояс GMT +3, время: 01:40.