網站運營seo文章大全提供全面的站長運營經驗及seo技術!一個不被flash、select、activex遮擋的、跨frame的無限分級菜單
該菜單改良自著名的chromemenu，可以無限分級，使用方法：
1、添加主菜單項
找到類似下面代碼的部分：
以下為引用的內容：
<div class="chromestyle" id="chromemenu">
<ul>
<li><a href="http://www.dynamicdrive.com">home</a></li>
<li><a href="#" rel="dropmenu1">resources</a></li>
<li><a href="#" rel="dropmenu2">news</a></li>
<li><a href="#" rel="dropmenu3">search</a></li>
</ul>
</div> |
在<ul>內部添加一個<li>,即可新添加一個主菜單項，注意給出“rel”的值，如上述代碼所示。
2、為一個主菜單添加下拉菜單：
先看一級菜單的寫法：
以下為引用的內容：
<!--子菜單1-->
<div id="dropmenu1" class="menu">
<ul>
<li><a href="http://eip/c10/內部郵件/default.aspx" target="_self" title="內部郵件">內部郵件</a></li>
<li><a href="http://eip/待辦公文/default.aspx" target="_self">待辦公文</a></li>
<li><a href="http://eip/c18/日程任務/default.aspx" target="_self">工作安排</a></li>
<li><a href="http://eip/c1/公文處理/default.aspx" target="_self">公文處理</a> </li>
</ul>
</div> |
注意div的id要和對應的主菜單項的rel參數相同，當鼠標移動到此菜單項時即可顯示下拉菜單，菜單樣式由class控制。
再來看怎么添加分級菜單，先看代碼：
以下為引用的內容：
<!--子菜單1-->
<div id="dropmenu6" class="menu">
<ul>
<li><a href="#" target="_self" title="駕駛艙">駕駛艙</a>
<!--[if lte ie 6]><a href="#">駕駛艙<font face='webdings' style='font-size: 6pt'>4</font><table><tr><td> <![endif]-->
<ul>
<li><a href="http://eip/c19/進入管理駕駛艙/default.aspx" title="管理駕駛艙">管理駕駛艙</a></li>
<li><a href="http://eip/c19/進入管理駕駛艙/default.aspx" title="單位預警艙">單位預警艙</a></li>
</ul>
<!--[if lte ie 6]> </td></tr></table></a> <![endif]-->
</li> <li><a href="http://eip/待辦公文/default.aspx" target="_self">待辦公文</a></li>
<li><a href="http://eip/c18/日程任務/default.aspx" target="_self">工作安排</a></li>
<li><a href="http://eip/c1/公文處理/default.aspx" target="_self">公文處理</a> </li>
</ul>
</div> |
要為哪個菜單項建立子菜單，就在其<li>內部添加代碼段：
以下為引用的內容：
<!--[if lte ie 6]><a href="#">駕駛艙<font face='webdings' style='font-size: 6pt'>4</font><table><tr><td> <![endif]-->
<ul>
<li><a href="http://eip/c19/進入管理駕駛艙/default.aspx" title="管理駕駛艙">管理駕駛艙</a></li>
<li><a href="http://eip/c19/進入管理駕駛艙/default.aspx" title="單位預警艙">單位預警艙</a></li>
</ul>
<!--[if lte ie 6]> </td></tr></table></a> <![endif]--> |
注意開始和結束部分的綠色部分一定要帶上 ，可以給由子菜單的菜單項加上一些特殊標記，以示由下一級菜單，比如上述代碼中的“<font face='webdings' style='font-size: 6pt'>4</font>”，即可在菜單項文字后面添加一個右向箭頭。
注意子菜單中的“<li><iframe style="position:absolute;top:0px; left:0px;z-index:2;width:150px;height:176px;border:0;" frameborder=0 scrolling=no></iframe></li>”，目的是解決被activex覆蓋的問題，如果頁面上沒有activex，可不用。
此段代碼在一個較大項目的企業門戶部分使用，測試沒有問題，該項目已經驗收完畢，代碼中沒有病毒。亂碼應該是編碼問題造成的，我的系統是英文版的。
