模板無憂
網頁特效
每日更新
|
TOP排行榜
|
Tag標簽
|
充值
無憂首頁
網頁模板
程序模板
建站教程
視頻教程
網頁特效
圖標素材
字體下載
站長工具
站長問答
網頁特效
菜單導航
圖片特效
文本鏈接
層和布局
頁面背景
表單按鈕
日期時間
計算轉換
鍵盤鼠標
瀏覽器
游戲娛樂
綜合其它
常用代碼
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在線編輯器
Mootools
HTML
JS廣告代碼合集
站長工具
站長常用軟件
網站綜合查詢
Alexa排名查詢
Google PR查詢
域名Whois查詢
網站收錄查詢
友情鏈接查詢
CSS2中文手冊
CSS精簡優化工具
網頁特效代碼
模板無憂
>
網頁特效
>
菜單導航特效代碼
>
收藏
分享
查看評論
菜單導航
演示
只顯示一個菜單_菜單導航特效
查看演示效果
特效Tag：
菜單
添加
只顯示一個菜單,您可以先修改部分代碼再運行.
<!--Design by Myhyli //--> <html> <head> <title>Crazy Window－模板無憂www.wf0088.com</title> <meta http-equiv="Content-Type" mrc="text/html; charset=gb2312"> <style type="text/css"> <!-- body,div { font:menu} .main {background-color:#DDDDDD} .sub {background-color:#EAEAEA;padding-left:1em} --> </style> <script> function closewin() { if (opener!=null && !opener.closed) { opener.window.newwin=null; opener.openbutton.disabled=false; opener.closebutton.disabled=true; } } var count=0;//做計數器 var limit=new Array();//用于記錄當前顯示的哪幾個菜單 var countlimit=1;//同時打開菜單數目，可自定義 function expandIt(el) { obj = eval("sub" + el); if (obj.style.display == "none") { obj.style.display = "block";//顯示子菜單 if (count<countlimit) {//限制2個 limit[count]=el;//錄入數組 count++; } else { eval("sub" + limit[0]).style.display = "none"; for (i=0;i<limit.length-1;i++) {limit[i]=limit[i+1];}//數組去掉頭一位，后面的往前挪一位 limit[limit.length-1]=el; } } else { obj.style.display = "none"; var j; for (i=0;i<limit.length;i++) {if (limit[i]==el) j=i;}//獲取當前點擊的菜單在limit數組中的位置 for (i=j;i<limit.length-1;i++) {limit[i]=limit[i+1];}//j以后的數組全部往前挪一位 limit[limit.length-1]=null;//刪除數組最后一位 count--; } } </script> </head> <body bgcolor="#666699" text="#000000" leftmargin="0" topmargin="0" onunload="closewin()" scroll="no" onload="if(opener!=null){opener.setbg();opener.setborder();opener.setmargin();opener.setscroll();opener.setbgfix();opener.setbgrepeat();}"> <p><a href=# onclick="window.close()"><font color="#FFFFFF">關閉窗口</font></a></p> <font color="#FFFFFF">當前同時打開菜單數目為1</font> <div id="bpj5lb5" class=main id=main1 onclick=expandIt(1)>menu1 <div id="n5jd5tj" class=sub id=sub1 style="display:none">sub1<br> sub2<br> sub3</div> </div> <div id="5h5fnpf" class=main id=main2 onclick=expandIt(2)>menu2 <div id="55hbhvx" class=sub id=sub2 style="display:none">sub2<br> sub2<br> sub3</div> </div> <div id="zbhp5zn" class=main id=main3 onclick=expandIt(3)>menu3 <div id="fjfnrhj" class=sub id=sub3 style="display:none">sub1<br> sub2<br> sub3</div> </div> <div id="55xtbr7" class=main id=main4 onclick=expandIt(4)>menu4 <div id="fvzrjlh" class=sub id=sub4 style="display:none">sub1<br> sub2<br> sub3</div> </div> <div id="hh5nrdf" class=main id=main5 onclick=expandIt(5)>menu5 <div id="bzfztjx" class=sub id=sub5 style="display:none">sub1<br> sub2<br> sub3</div> </div> </body> </html>
所屬頻道：
菜單導航特效
/
更新時間：2010-05-23
[收藏]
[報錯]
[返回列表]
相關
菜單導航特效
：
CSS+div+js組合強大實現超酷菜單
超酷仿GOOGLE首頁導航菜單效果
仿網易的滑動門技術DIV+CSS實現
仿藍色理想網站的導航菜單
鼠標觸及帶邊框菜單
用JS實現的類似框架的鏈接導航模式
CSS立體層
右鍵彈出菜單
純css的導航下拉菜單
隱藏菜單效果
css模擬title和alt的提示效果
下拉菜單鏈接頁面打開方式選擇
菜單導航特效Rss訂閱
特效代碼搜索
菜單導航特效推薦
B2B網站的滑動門，可以定義某個TAB是否滑動切換
仿QQ導航菜單
Js打造層拖動實例：網站菜單拖拽移位效果
JS+Css多級可拖動帶動畫的滑出式展開菜單
綠色簡潔CSS導航條
一款經典的CSS二級下拉菜單
基于表格的 Tab
另類個性的CSS導航菜單
面試時候寫的CSS橫向二級菜單
仿網易漂亮的TAB選項卡(標簽)
猜你也喜歡看這些
響應鼠標的圖片虛實效果代碼
用CSS實現圖片的雙邊框效果
Javascript 仿Flash圖片輪翻
JavaScript圖片預加載代碼，顯示loading
一款平滑的鼠標放上圖片抖動代碼
JS圖片漸現漸隱效果
變長寬的圖片
CSS制作的類似相冊瀏覽的功能
JavaScript圖片扭曲變形效果
圖片震動
相關鏈接：
復制本頁鏈接
|
搜索只顯示一個菜單
特效說明：
菜單導航模板
-
只顯示一個菜單
。
。