Jquery 悬停切换答案

【问题标题】：Jquery hover toggleJquery 悬停切换
【发布时间】：2011-06-06 19:21:03
【问题描述】：

嗨，我所做的是在 document.load 上，我降低了导航 li 的高度，并将导航下方的 div 设置为动画。我想要做的是在导航中每个 li 的悬停上反转下面的动画 jquery 代码：

              $('.tabs li a').animate({
                height: '40'
              }, 1000, function() {
                // Animation complete.
              });

              $('#tabs-wrap').animate({
                marginTop: '-=147'
              }, 1000, function() {
                // Animation complete.
              });

如果使用悬停触发器，我将如何反转此代码？？

谢谢

【问题讨论】：

动画高度也可以通过“切换”来完成。 A 会完全不可见吗？

标签： jquery menu hover jquery-animate

【解决方案1】：

类似以下内容？

$('tabs li a').hover(function(){
  $(this).animate({height:40}, 1000, function(){
      //animation complete
  });
}, function(){
  $(this).animate({height:0}, 1000, function(){
      //animation complete
  });  
});

$('#tabs-wrap').hover(function(){
  $(this).animate({marginTop: '-147'}, 1000, function(){
   //animation complete   
  });

}, function(){
  $(this).animate({marginTop: '147'}, 1000, function(){
   //animation complete
  });

});

请注意，对于像这样的动画，请记住在您的元素上继续执行另一个动画之前停止您的动画。

例子：

$(this).stop().animate({height:300}), 1000, function(){ });

【讨论】：

没问题，很高兴能为您提供帮助。

【解决方案2】：

如果我没看错，您正在寻找.hover() 函数，不是吗？

【讨论】：