ツリーメニュー(入れ子タイプ)

動作ブラウザ
Internet Explorer Netscape Navigator
4.0x 4.5 5.0x 5.5 6.0 4.x 6.0
Windows - × ×
Macintosh - - × ×
UNIX - - - - - × ×

解  説  ツリーメニューを入れ子にするには、divタグ内にdivタグを入れ子になるように記述します。何段階でも入れ子にすることができます。これ以外はツリーメニュー(フラット)とスクリプトも全く同じです。
コード <html> <head> <title>クリックするとツリーメニューを表示する(入れ子タイプ)</title> <script language="JavaScript"><!-- vType = ["none","block"]; function exMenu(tName) { tMenu = document.all[tName].style; tMenu.display = vType[tMenu.display.indexOf("none") + 1]; } // --></script> </head> <body bgcolor="white"> ■リンク<br> <a href="javaScript:exMenu('treeMenu1')">+</a>■出版社<br> <div id="treeMenu1" style="display:none"> ├<a href="http://www.impress.co.jp/">インプレス</a><br> ├<a href="http://www.ascii.co.jp/" >アスキー</a><br> └<a href="javaScript:exMenu('treeMenu2')">+</a>その他<br> <div id="treeMenu2" style="display:none">   ├<a href="http://www.gihyo.co.jp/">技術評論社</a><br>   └<a href="http://www.cqpub.co.jp/">CQ出版</a><br> </div> </div> </body> </html>

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!