Как добавить / удалить меню jQuery с подменю?

Question

Как добавить / удалить меню jQuery с подменю?

Я пытаюсь сделать меню, которое имеет много ссылок, и каждая ссылка имеет свой собственный список, это то, что я использую..

<body>
<div id="menu">
  <a href="#"><li>users <br /></a></li>
  <a href="#"><li>product <br /></a></li>
  <a href="#"><li>movies <br /></a></li>
  <a href="#"><li>clips <br /></a></li>
  <a href="#"><li>teaser <br /></a></li>
  <a href="#"><li>trailer <br /></a></li>
  <a href="#"><li>HDMovie <br /></a></li>
</div>
</body>

мой JQuery..

$(document).ready(function(){
$(".users").bind("click", function(){
   $('#menu').fadeOut();
   $('#sub_menu').fadeIn();
})

Это только для ссылки пользователей, чтобы показать свой подсписок. Если я хочу сделать то же самое со ссылками на товары, фильмы и клипы, мне нужно скопировать и вставить функцию? Может ли кто-нибудь здесь дать мне пример функции, поэтому мне не нужно копировать вставить?

Спасибо;)

1

javascript jquery css xhtml-1.0-strict

Источник

20 фев '09 в 21:37

3 ответа

Другие вопросы по тегам javascript jquery css xhtml-1.0-strict

user6277 21 фев '09 в 01:36 2009-02-21 01:36 · Answer 1 · 2009-02-21 01:36

Честно говоря, я бы использовал плагин Superfish, а не изобретать велосипед. Объедините его с hoverIntent, и он сможет делать все, что вам нужно.

1

Источник

user6277 21 фев '09 в 01:36

24 фев '09 в 09:12 2009-02-24 09:12 · Answer 2 · 2009-02-24 09:12

Спасибо, ребята, я использовал эту функцию, она работает, она затухает в моем меню, а также исчезает в подменю, но то же самое подменю для каждой ссылки. Я хочу, чтобы подменю2 исчезло при нажатии на следующую ссылку.

Вот ссылка, что я делаю http://umarstudio.com/test/html/screen_2b.htm

Мне просто нужно подменю, чтобы исчезнуть для каждой ссылки.. Спасибо;)

user37881 20 фев '09 в 21:53 2009-02-20 21:53 · Answer 3 · 2009-02-20 21:53

Попробуйте что-то вроде этого. Кроме того, убедитесь, что вы правильно завершили вложенные теги

<body>
<ul id="products" class="menu">
<li><a href="#">users</a>
    <ul class="sub_menu'>
        <li><a href="#">user 1</a></li>
        <li><a href="#">user 1</a></li>
        <li><a href="#">user 1</a></li>
    </ul>
</li>
<li><a href="#">product</a>
    <ul class="sub_menu'>
        <li><a href="#">product 1</a></li>
        <li><a href="#">product 1</a></li>
        <li><a href="#">product 1</a></li>
    </ul>
</li>
<li><a href="#">movies</a></li>
<li><a href="#">clips</a></li>
<li><a href="#">teaser</a></li>
<li><a href="#">trailer</a></li>
<li><a href="#">HDMovie</a></li>
</ul>

</body>

сценарий

$(document).ready(function(){
    $(".menu > li > a").bind("click", function(){
        $('.sub_menu').fadeOut();
        $(this).parent().find('.sub_menu').fadeIn();
    }
})