借助 插件 Lavalamp实现导航条动态显示效果, 以前用animate来实现,效果不是很好 复制代码 代码如下: <BR>$(function() { <BR>$(".nav").lavaLamp({ <BR>fx: "backout", <BR>speed: 1100, <BR>mouseover:function(event, menuItem){alert();} <BR>}); <BR>}); <br><br> <br><br>.nav { <BR>width:650px; <BR>height:100px; <BR>float:left; <BR>position: relative; <BR>} <BR>.nav li { <BR>width:auto; <BR>min-width:40px; <BR>line-height:100px; <BR>padding:0 15px; <BR>margin:0 10px 0 0; <BR>color:#000; <BR>font-size:14px; <BR>text-align:center; <BR>float:left; <BR>} <BR>.nav li.back { <BR>background: #86bf40; <BR>-moz-border-radius: 5px; <BR>-webkit-border-radius: 5px; <BR>line-height: 2; <BR>width: 40px; <BR>height: 100px; /*----*/ <BR>z-index: 1; /*----*/ <BR>position: absolute; /*----*/ <BR>margin-top: 0px; <BR>margin-left:5px; <BR>} <BR>.nav li a { <BR>color: #000; <BR>z-index: 2; /*----*/ <BR>font-variant: small-caps; <BR>text-decoration: none; <BR>position: relative; /*----*/ <BR>margin: auto 10px; <BR>} <br><br> 首 页 个人版 中小版 企业版 服务与价格 关于我们 登 录 注 册