JavaScript+CSS实现仿Mootools竖排弹性动画菜单效果

本文实例讲述了Javascript+CSS实现仿Mootools竖排弹性动画菜单效果。分享给大家供大家参考。具体如下：

这里演示Javascript+CSS仿Mootools竖排黑色动画菜单，并非使用了Mootools，但效果却和使用了Mootools差不多，动画效果平滑，操作舒服，给菜单增色不少。

运行效果截图如下：

在线演示地址如下：

http://demo.jb51.net/js/2015/js-css-mootools-style-demo/

具体代码如下：

#menu {
 height: auto;
 width: 350px;
 float: left;
}
body {
 overflow: auto;
 background: #333;
 color: #FFF;
 font: 12px Arial, Helvetica, sans-serif;
}
#menu li {
 display: block;
 list-style-type: none;
}
#menu a {
 font-size: 11px;
 color: #FFF;
 padding-right: 10px;
 padding-left: 10px;
 line-height: 30px;
 text-decoration: none;
 background: #000 url(images/bg.jpg) no-repeat left;
 height: 30px;
 width: 180px;
 display: block;
 outline:0;
 margin-bottom: 5px;
}
#menu a:hover {
 color: #CCFF00;
 background: #000 url(images/bg1.jpg) no-repeat left;
}



 
 

  
JQuery插件
  
Ext 皮肤
  
CSS特效
  
Ajax技巧集