jquery - 导航元素在悬停时上下跳动

Question

尝试使用 .animate 使滑动元素具有绝对定位。出于某种原因，元素开始在悬停时上下跳跃。 UL 的默认高度是 56px，我希望它在悬停时扩展到 469px:

$(function() {

$('nav ul').hover(function(){
    $(this).animate({height:'469px'},'slow');
    });
$('nav ul').mouseout(function(){
    $(this).animate({height:'56px'},'slow');
    }); 

});

HTML 是:

<nav>
    <ul>
      <li class="active"><a href="#">Menu Icon</li><!--visible menu icon-->
      <li><a href="#">Test</a></li>
      <li><a href="#">Test</a></li>
      <li><a href="#">Test</a></li>
      <li><a href="#">Test</a></li>
      <li><a href="#">Test</a></li>
      <li><a href="#">Test</a></li>
    </ul>
</nav><!--end nav-->

Answer 1

正确的代码是:

$('nav ul').hover(function(){
    $(this).animate({height:'469px'},'slow');
}, function() {
    $(this).animate({height:'56px'},'slow');
});

http://api.jquery.com/hover/