簡潔的滑出菜單

2024-09-05 12:19:19

字體：大中小

來源：轉載

供稿：網友

一款風格簡潔的CSS+JS滑出菜單，支持二級，不過你可將其變為三級，再嵌套一個LI列表就可以了，顏色你自己改，直到你滿意為止。

<!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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>滑出菜單</title> <script language="javascript"> startList = function() { if (document.all && document.getElementById) { navRoot = document.getElementById("nav"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="LI") { node.onmouseover=function() { this.className+=" over";  }  node.onmouseout=function() {  this.className=this.className.replace(" over", "");  }  }  }  } } window.onload=startList; </script> <style type="text/css">  </style> </head> <body> <ul id="nav">   <li>首頁</li>   <li>ASP源碼   <ul>   <li>社區論壇</li>   <li>AJAX相關</li>   <li>精品程序</li>   <li>CMS建站</li>   <li>聊天留言</li>   </ul>   </li>   <li>PHP源碼   <ul>   <li>新聞文章</li>   <li>聊天留言</li>   <li>論壇社區</li>   <li>圖片相冊</li>   </ul>   </li>  </ul>  </body> </html>

上一篇：很獨特的彈性下拉導航菜單

下一篇：Js+DVML很酷的右鍵動畫彈出菜單