Анимировать UL (навигация) в jQuery - PullRequest
Новая
       28

Анимировать UL (навигация) в jQuery

1 голос
/ 22 февраля 2011

Я сделал навигацию, используя UL и CSS.Дочерние элементы ul по умолчанию скрыты - при наведении курсора мыши на родительский LI (т. Е. На элемент меню) я бы хотел отобразить дочерний элемент UL, сдвинув его вниз.

Какой лучший способ добиться этого?

У меня сейчас есть этот код, и мне было интересно, есть ли лучший способ сделать это: 

$("div.menu ul.children").each(function(i){
    var ul = $(this);
    var he = ul.height();
    ul.height(0);
    var li = ul.parent();
        li.bind("mouseenter", function(){
            ul.animate({height: he+'px'}, {queue:false, duration: 100});
        });
        li.bind("mouseleave", function(){
            ul.animate({height: '0px'}, {queue:false, duration: 100});
        });
    });

1 Ответ

1 голос
/ 22 февраля 2011

Что-то вроде этого: 

$(".togglevisibility")
  .mouseenter(function() {
    $(this).children("ul").slideDown();
  })
  .mouseleave(function() {
    $(this).children("ul").slideUp();
  });

См. http://jsfiddle.net/xfkeM/

...