JQuery Selector Подменю / Раскрывающийся список - PullRequest
0 голосов
/ 03 февраля 2012

Я хотел бы создать очень простое подменю:

HTML:

<ul>
  <li><a href="#">Main-item</a>
     <ul id="show">
        <li id="subitem"><a href="#">Sub-Item</a></li>
     </ul>
  </li>
</ul>

jQuery:

$(document).ready(function(){
  $('#access').hover(function () {
    $(this).find('ul').stop().animate({opacity:1, paddingTop:'10px'}, 400);
  }, function () {
    $(this).find('ul').stop().animate({opacity:0, paddingTop:'0px'}, 300);
  });
});

ul имеетфоновое изображение, и я хочу, чтобы #show был анимированным или не просто все li

Ответы [ 2 ]

0 голосов
/ 03 февраля 2012

Я могу только представить, что вы хотите сделать.

Проверьте образец и это jsFiddle

Пример

Html

<div id="access">
<ul>
  <li><a href="#">Main-item</a>
     <ul id="show">
        <li id="subitem"><a href="#">Sub-Item</a></li>
     </ul>
  </li>
  <li><a href="#">Main-item 2</a>
     <ul id="show">
        <li id="subitem"><a href="#">Sub-Item</a></li>
     </ul>
  </li>    
</ul>
</div>

JQuery

$(document).ready(function()
{
    $('li[id!="show"]').hover(function () {
        $(this).find('ul#show').stop().animate({opacity:1, paddingTop:'10px'}, 400);
    }, function () {
        $(this).find('ul#show').stop().animate({opacity:0, paddingTop:'0px'}, 300);
    })
});
0 голосов
/ 03 февраля 2012

Если я правильно понимаю ваш вопрос, вам нужно простое изменение: $('#access') должно быть $('#access > ul > li') (при условии, что #access является родителем верхнего ul).

Тогда функция наведениябудет применяться к li, находя единственное подменю ul, тогда как в настоящее время вы находите все подменю.

...