JavaScript+CSS仿Mootools豎排動(dòng)畫(huà)菜單

2024-09-05 12:20:07

字體：大中小

供稿：網(wǎng)友

JavaScript+CSS仿Mootools豎排黑色動(dòng)畫(huà)菜單，并非使用了Mootools，但效果卻和使用了Mootools差不多，動(dòng)畫(huà)效果平滑，操作舒服，給菜單增色不少。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>豎排黑色動(dòng)畫(huà)菜單</title><style type="text/css">#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(/jscss/demoimg/200907/bg.jpg) no-repeat left; height: 30px; width: 180px; display: block; outline:0; margin-bottom: 5px;}#menu a:hover { color: #CCFF00; background: #000 url(/jscss/demoimg/200907/bg1.jpg) no-repeat left;}</style></head><body> <div   class="iwvjtn8m0"   id="menu">  <ul>   <li>JQuery插件</li>   <li>Ext 皮膚</li>   <li>CSS特效</li>   <li>Ajax技巧集</li>  </ul> </div><script type="text/javascript">var $ = function(_sId){return typeof _sId == 'string' ? document.getElementById(_sId) : _sId;}var Each=function (a,fn){for(var i=0;i</body></html>

上一篇：簡(jiǎn)單明了的CSS導(dǎo)航條

下一篇：最簡(jiǎn)Table選項(xiàng)卡