一個簡單的收縮菜單效果

2019-11-21 02:14:51

字體：大中小

來源：轉載

供稿：網友

<table width="174">   <tr>     <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay0)" >網頁設計</a></td>   </tr>   <tr id='lay0' style="display:none;">     <td><table width="100%" border="0" cellspacing="0">       <tr>         <td width="12%"> </td>         <td width="88%"><a href="Teach_Dr.asp?owen1=網面設計&owen2=基礎知識" target="_blank">基礎知識</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網面設計&owen2=HTML和CSS" target="_blank">HTML和CSS</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網面設計&owen2=Dreamweaver" target="_blank">Dreamweaver</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網面設計&owen2=FrontPage" target="_blank">FrontPage</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網面設計&owen2=Xhtml" target="_blank">Xhtml</a></td>       </tr>     </table></td>   </tr>   <tr>     <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay1)" >FLASH</a></td>   </tr>   <tr id='lay1' style="display:none;">     <td><table width="100%" border="0" cellspacing="0">       <tr>         <td width="11%"> </td>         <td width="89%"><a href="Teach_Dr.asp?owen1=Flash&owen2=基礎知識" target="_blank">基礎知識</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=Flash&owen2=初級操作">初級操作</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=Flash&owen2=實例教學" target="_blank">實例教學</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=Flash&owen2=Action應用" target="_blank">Action應用</a></td>       </tr>     </table></td>   </tr>   <tr>     <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay2)" >平面設計</a></td>   </tr>   <tr id='lay2' style="display:none;">     <td><table width="100%" border="0" cellspacing="0">       <tr>         <td width="13%"> </td>         <td width="87%"><a href="Teach_Dr.asp?owen1=平面設計&owen2=基礎知識" target="_blank">基礎知識</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=平面設計&owen2=Photoshop">Photoshop</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=平面設計&owen2=Fireworks">Fireworks</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=平面設計&owen2=濾鏡專輯" target="_blank">濾鏡專輯</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=平面設計&owen2=CorelDraw" target="_blank">CorelDraw</a></td>       </tr>     </table></td>   </tr>   <tr>     <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay3)" >編程開發</a></td>   </tr>   <tr id='lay3' style="display:none;">     <td><table width="100%" border="0" cellspacing="0">       <tr>         <td width="13%"> </td>         <td><a href="Teach_Dr.asp?owen1=編程開發&owen2=Asp" target="_blank">Asp</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=編程開發&owen2=ASP.NET" target="_blank">ASP.NET</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=編程開發&owen2=基礎知識" target="_blank">JSP</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=編程開發&owen2=基礎知識" target="_blank">PHP</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=編程開發&owen2=基礎知識" target="_blank">數據庫</a></td>       </tr>     </table></td>   </tr>   <tr>     <td bgcolor="#99CCFF"><a href="javascript:showmenu(lay4)" >網頁特效</a></td>   </tr>   <tr id='lay4' style="display:none;">     <td><table width="100%" border="0" cellspacing="0">       <tr>         <td width="13%"> </td>         <td><a href="Teach_Dr.asp?owen1=網頁特效&owen2=窗體特效" target="_blank">窗體特效</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網頁特效&owen2=菜單特效" target="_blank">菜單特效</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網頁特效&owen2=文本特效" target="_blank">文本特效</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網頁特效&owen2=鼠標特效" target="_blank">鼠標特效</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網頁特效&owen2=圖像媒體" target="_blank">圖像媒體</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網頁特效&owen2=時間日期" target="_blank">時間日期</a></td>       </tr>       <tr>         <td> </td>         <td><a href="Teach_Dr.asp?owen1=網頁特效&owen2=其它綜合" target="_blank">其它綜合</a></td>       </tr>     </table></td>   </tr> </table> <script language=JavaScript> function showmenu(strID){     var i;     for(i=0;i<=4;i++){         var lay;         lay = eval('lay' + i);         if (lay.style.display=="block" && lay!=eval(strID)){             lay.style.display = "none";         }     }     if (strID.style.display=="none"){         strID.style.display = "block";     }else{         strID.style.display = "none";     } } </script>

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]

上一篇：鍵盤事件中keyCode、which和charCode 的兼容性測試

下一篇：從csdn弄下來的頁面預先載入效果