Автоматическое меню для тега UL?

Question

Есть ли способ использовать jQuery для автоматического применения вертикального аккордеонного меню (или другого типа вертикального меню) к тегу UL?Итак, что-то вроде этого может стать меню с помощью вызова JavaScript:

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
</ul>

Другими словами, его дочерние элементы LI станут пунктами меню.Было бы здорово, если бы высоту меню можно было ограничить.Спасибо.

Answer 1

показано здесь на этом FIDDLE : -D

js:

$('.menu .menu-item').hover(function(){$(this).children('ul').toggle('blind')})
    $('.menu .menu-item ul').hide()

html:

<ul class='menu'>
    <li class='menu-item'> ITEM
       <ul class='sub-menu'>
         <li>Item 1</li>
         <li>Item 2</li>
         <li>Item 3</li>
         <li>Item 4</li>
       </ul>
    </li>
</ul>

Answer 2

В jQuery UI github репозиторий есть новый класс меню, который будет в jQuery UI 1.9, который должен удовлетворить ваши потребности.

Он совместим с jQuery UI 1.8 и ThemeRoller.

Он обрабатывает вложенные подменю.Я недавно использовал его в проекте, и он довольно хорош.

Answer 3

Для этого есть тонна из плагинов .

Superfish построен из меню Suckerfish (только для css), но добавляет немного javascript для обработки некоторых извращенных причуд решения css.

Answer 4

вам даже не нужен Javascript (*).используйте suckerfish: http://htmldog.com/articles/suckerfish/dropdowns/

(* Я думаю, что только для неподдерживаемого события в IE6)

Answer 5

Я на самом деле использую AllWebMenus Pro (Likno Software) для создания вертикальных меню, и я вполне доволен. Я думаю, что это будет работать для вас.