Как сдвигать () части меню?

0

Предположим, у меня есть меню списка:

<html>
<body>
  <div id="menu">
  <ul>
      <li>News
          <ul class="inner_menu">
              <li>Hi</li>
          </ul>
      </li>
      <li>Bumble
          <ul class="inner_menu">
              <li>Hellos</li>
          </ul>
      </li>
      <li>Scratch</li>
      <li>Snap</li>
  </ul>
</div>
</body>
</html>

И я хочу, чтобы все неупорядоченные списки были скрыты, но slidedown/up (jquery slideToggle()), если вы наведете над элементом "li", в котором они вложены. У меня возникают проблемы с выбором правильных элементов. Например, я хочу, чтобы slideToggle().inner_menu с "Привет", когда я нависаю над "Новостями".

До сих пор мне удалось скользить() все из.inner_menus или получать разные нежелательные результаты. Я думаю, что я могу просто добавить кучу разных идентификаторов, но это было бы так грязно, учитывая два похожих меню с большим количеством inner_menus.

  • 1
    Я бы порекомендовал прочитать об обходе DOM. это было бы хорошим местом для начала: api.jquery.com/category/Traversing . Это поможет вам воздействовать на правильный узел с каждым действием.
  • 0
    Спасибо, обязательно посмотрю здесь.
Теги:

1 ответ

4
Лучший ответ

Вы можете использовать hover in/out handler:

ДЕМО jsFiddle

$('li').hover(function(){
    $(this).children('ul').slideToggle();
});
Поделиться
  • 0
    Еще один вопрос. Каждый li из .inner_menus ul является ссылкой. Как только вы щелкнете по нему, часть рядом с меню изменится, но меню останется на своем месте. Предположим, что я использовал $('li').click() .inner_menu $('li').click() вместо этого (и сначала я скрываю все .inner_menu ), затем после того, как я .inner_menu на News и затем Hi , часть веб- .inner_menu изменится, но и Hi исчезнет. Это немного странно, потому что вам придется нажимать на нее каждый раз. Я бы хотел, чтобы он оставался в том же статусе, который скрыт или показан.
  • 0
    Я не уверен, что понимаю, что вы имеете в виду, обновите jsfiddle, чтобы повторить вашу проблему
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню