截图抢先预览:

代码部分:
<title>jquery特效菜单(二)-弹性缓动下拉</title>
<style type="text/css">
body{font-size:84%; background:#E8EDED; padding:150px 0 0 200px;}
ul.zxx_menu{margin:0; padding:0; list-style-type:none;}
ul.zxx_menu li{width:100px; height:30px; background:#999999; border:1px solid #cccccc; border-right:1px solid white; border-left-width:0; text-align:center; float:left; overflow:hidden;}
ul.zxx_menu li:first-child{border-left-width:1px;}
ul.zxx_menu li:last-child{border-right-color:#cccccc;}
ul.zxx_menu li a{display:block; height:100%; line-height:30px; color:#333333; border-left:1px solid #cccccc; text-decoration:none;}
ul.zxx_menu li:first-child a{border-left:0;}
ul.zxx_menu li a:hover{background:white; border-left-color:white; font-weight:bold;}
ul.zxx_menu li a span{display:block; text-align:center; font:bold 1.5em/2em "Lucida Sans Unicode", "Lucida Grande", sans-serif; color:#F30; margin-top:20px;}
.zxx_author{width:300px; padding-right:5px; padding-bottom:5px; border-bottom:1px solid #3C6; color:#666666; text-align:right; position:absolute; left:310px; top:30px;}
</style>
<script type="text/javascript" src="../js/jquery-1.2.6.pack.js"></script>
<script type="text/javascript" src="../js/jquery.easing.1.3.js"></script>
--------------------------------------------我是卡哇伊分隔线,哦也!---------------------------------------------------
<body>
<div class="zxx_author">by zhangxinxu 2009-07-18 12:23</div>
<ul class="zxx_menu">
<li><a href="#zhangxinxu">青春<span>流逝</span></a></li>
<li><a href="#zhangxinxu">回忆<span>感伤</span></a></li>
<li><a href="#zhangxinxu">奋斗<span>不息</span></a></li>
<li><a href="#zhangxinxu">爱情<span>遥远</span></a></li>
</ul>
<script type="text/javascript">
$(document).ready(function(){
$("ul.zxx_menu li").mouseover(function(){
$(this).css("background-color","white").stop().animate({height:"125px"},{queue:false, duration:600, easing:"easeOutBounce"});
}).mouseout(function(){
$(this).css("background-color","#999999").stop().animate({height:"30px"},{queue:false, duration:600, easing:"easeOutBounce"});
});
</script>
</body>
有了jquery缓动动画插件,实现效果就是一句话而已。
页面效果预览单击这里