jQuery菜单动画

Question

我正在建立一个网站，我正在使用jQuery为水平选项卡式菜单设置动画效果。我想达成什么可以看这里：

/链接删除/

如果将鼠标悬停/鼠标悬停“链接1”选项卡，你会看到一个白色的div正在扩大。每个标签菜单项都是一个样式化的li标签。我想要做的是，当你悬停/鼠标悬停，即“链接2”选项卡时，白色div会收缩，然后再次展开与“链接2”相关的内容而不是“链接1”。此外，默认情况下，“链接1”选项卡应该展开（即，当您刚刚进入网站时）。

您是否有任何jQuery ninjas知道如何做到这一点？我目前拥有的是：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     var $div = $('#divtest'); 
     var height = $div.height(); 
     $div.hide().css({ height : 0 }); 

     $('#forside').hover(function() { 
      if ($div.is(':visible')) { 
       $div.animate({ height: 0 }, { duration: 200, complete: function() { 
        $div.hide(); 
       } }); 
      } else { 
       $div.show().animate({ height : height }, { duration: 200 }); 
      } 

      return false; 
     }); 
    }); 
</script> 

我需要有4个不同的div，为每个鼠标悬停展开/收缩吗？

如果我没有说清楚我的问题是什么，请告诉我，我会尽力提前制定:)

谢谢！

Answer 1

我找到了解决方案。但是，这感觉比实际感觉就像一个漂亮的到了功能更烦人;）

我找到了解决办法是在这里：http://www.noupe.com/tutorial/drop-down-menu-jquery-css.html

的效果基本show和了slideDown为我做！