[JS]符合網頁標準化『樹狀選單 TreeView』
2008/12/19放在<head>…</head>之間 function $(_0){ return document.getElementById(_0); } function popmenu(tableName,obj){ if ($(tableName).style.display=="none"){ $(tableName).style.display="block"; $(obj).getElementsByTagName("img")[0].src = “img/open.gif”; }else{ $(tableName).style.display=”none”; $(obj).getElementsByTagName(”img”)[0].src = “img/close.gif”; } } 放在<body>…</body>之間:(item) <div class="item"> <a href="javascript:popmenu('DetailItem1','item1');" id="item1"> <img src="img/close.gif" border="0"> Item</a> </div> 放在<body>…</body>之間:(detailItem) <div class="detailItem" id="DetailItem1" style="display:none;"> ‧<a href="#">DetailItem01</a> ‧<a href="#">DetailItem02</a> ‧<a href="#">DetailItem03</a> </div> 範例中只作了一層,若要多層,只要更改<a href="javascript:popmenu(‘DetailItem2′,’item2’);" id="item2"><div class="detailItem" id="DetailItem2" style="display:none;">即可,依此類推,但勿必注意到item2的id="item2",DetailItem2的 id="DetailItem2"兩兩一組,名稱要一樣。 [範例預覽]
放在<head>…</head>之間
放在<body>…</body>之間:(item)
放在<body>…</body>之間:(detailItem)
範例中只作了一層,若要多層,只要更改<a href="javascript:popmenu(‘DetailItem2′,’item2’);" id="item2"><div class="detailItem" id="DetailItem2" style="display:none;">即可,依此類推,但勿必注意到item2的id="item2",DetailItem2的 id="DetailItem2"兩兩一組,名稱要一樣。
[範例預覽]
放在<head>…</head>之間
function $(_0){ return document.getElementById(_0); } function popmenu(tableName,obj){ if ($(tableName).style.display=="none"){ $(tableName).style.display="block"; $(obj).getElementsByTagName("img")[0].src = “img/open.gif”; }else{ $(tableName).style.display=”none”; $(obj).getElementsByTagName(”img”)[0].src = “img/close.gif”; } }
放在<body>…</body>之間:(item)
<div class="item"> <a href="javascript:popmenu('DetailItem1','item1');" id="item1"> <img src="img/close.gif" border="0"> Item</a> </div>
放在<body>…</body>之間:(detailItem)
<div class="detailItem" id="DetailItem1" style="display:none;"> ‧<a href="#">DetailItem01</a> ‧<a href="#">DetailItem02</a> ‧<a href="#">DetailItem03</a> </div>
範例中只作了一層,若要多層,只要更改<a href="javascript:popmenu(‘DetailItem2′,’item2’);" id="item2"><div class="detailItem" id="DetailItem2" style="display:none;">即可,依此類推,但勿必注意到item2的id="item2",DetailItem2的 id="DetailItem2"兩兩一組,名稱要一樣。
[範例預覽]
※如有發現掉圖或檔案無法下載,請由回應區留言告知,將會盡速處理!
※本站採用CC授權請勿全文轉貼本站文章,歡迎「部份引用」與介紹,並註明出處,謝謝。
※本站採用CC授權請勿全文轉貼本站文章,歡迎「部份引用」與介紹,並註明出處,謝謝。
回應本文