Question

我有一组嵌套的无序列表，我将其用于下拉菜单结构：

UL＆gt; LI> DIV＆gt; UL> LI * n＆gt;甲

我正在使用jQuery为div和子ul的下拉/显示设置动画：

jQuery('ul.top-ul li.top-li').hover(function() {
          jQuery(this).animate({height:"150px"},200);
          jQuery(this).find('div').animate({height:"150px"},4000, function() {
              jQuery('ul.top-ul li.top-li div p').fadeIn('fast');
          });
      }, function() {
          jQuery('ul.top-ul li.top-li div p').fadeOut('fast');
          jQuery(this).animate({height:"22px"},200);
          jQuery(this).find('div').animate({height:"0px"},200);
      })

然而，当这个动画运行时，直接在div下面的UL消失，直到动画运行完毕。

这可以在http://acldev.com/rsac/index.php看到（为了强调这一点，我放慢了动画的速度。

导致UL消失的原因是什么？当我停止动画DIV时，UL不会消失。

Answer 1

由于第三行中的选择器jQuery(this).find('div').animate...，您的菜单会消失。

尝试使用类似jQuery(this).find('.maincats ul').animate...的内容来显式显示并消失嵌套列表。

希望它有所帮助。

在jQuery Animation期间，顶级UL元素消失

1 个答案: