jquery悬停动画高度(切换)

Question

我确信这是一个常见问题，我已经尝试了该网站上的许多线程来尝试解决我的问题，但我似乎无法使其正常工作。基本上我有一个子菜单，当父菜单悬停在其上时需要显示该子菜单，但是如果您在加载完成之前将鼠标从菜单项上移开，那么当您再次将鼠标悬停在其上时，新的切换高度是错误的。如果这有道理吗？我试图让它运行的网站在这里:

http://annawhitlam.website.2011.360southclients.com/

(“关于我们”菜单有子菜单)

我的代码是:

$("#menu .content ul li.parent").hover(function(){
  $(this).find("ul").stop().animate({ height: "toggle" }, 150, "easeInSine");
}, function(){
  $(this).find("ul").stop().animate({ height: "toggle" }, 350, "easeInSine");
});

如有任何帮助，我们将不胜感激:)

Answer 1

或者，您可以尝试此操作而不是停止动画。

$("#menu .content ul li.parent").hover(function(){
  if($(this).find("ul:not(:animated)").length)
     $(this).find("ul").animate({ height: "toggle" }, 150, "easeInSine");
  else
     $(this).find("ul").show();
}, function(){
  if($(this).find("ul:not(:animated)").length)
      $(this).find("ul").animate({ height: "toggle" }, 350, "easeInSine");
  else
      $(this).find("ul").hide();
});