ツリーメニューについて

解決済

質問者：MochaBrown
質問日時：2006/09/16 15:22
回答数：3件

フレームページで、JavaScriptで文字(下の場合は「親メニュー」)クリックすると
開閉するツリーメニューを使用したいと思っています(フレームあり・なしは訪問者の自由で選べるようにしています)。

http://himajin.moo.jp/menu/menu.html ここや、
http://www.openspc2.org/reibun/javascript/#8　こちらの05・06・63などを参考にして、
自分なりにシンプルに変更してみたのですが、記述に問題点などはありますでしょうか？

以下が、そのソースです(簡略化しています)。
<html>
<head>
<script type="text/JavaScript">

</script>
</head>
<body>
<a href="JavaScript:treeMenu('treeMenu1')">親メニュー</a>
<div id="treeMenu1" style="display:none">
　<li><a href="a.html" target="main">子メニュー</a></li>
　<li><a href="b.html" target="main">子メニュー</a></li>
</body>
</html>

また、「document.all」はIE専用だと聞いたので「document.getElementById」
に変更してみたのですが、これでほかのブラウザでも問題は無く使用できますか？
JavaScriptは初めてなのであまり自信がありません。
IEとFirefoxでは動作確認済みです。よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.3ベストアンサー

回答者： yambejp
回答日時：2006/09/16 21:37

個人的にはliを使うならulの子供で使います。

上にマージンができてしまうのは、margin-top:0px;を
しておけばよいでしょう。
あと、スキキライになりますが、こんかいのif条件は
三項演算子を使ったほうがわかりやすいかも・・・。

<html>
<head>
<script type="text/JavaScript">

</script>
</head>
<body>
<a href="JavaScript:treeMenu('treeMenu1')">親メニュー</a>
<ul id="treeMenu1" style="display:none;margin-top:0px;">
<li><a href="a.html" target="main">子メニュー</a></li>
<li><a href="b.html" target="main">子メニュー</a></li>
</ul>
</body>
</html>
（実際に本運用の際はcssを外部化したりしたほうので
しょうけど、とりあえずは今回はわかりやすく直接
タグに指定をいれてあります）

ちなみに、divにdisplay:noneを直接書きこんでますが
このままではjavascriptなしのブラウザでは、子メニューが
まったく表示されなくなりますが、よろしいのでしょうか？

- 0
- 件

通報する

この回答へのお礼

<li>タグを使用する場合には<ul>も必要だということを失念していました。
『tMenu.display=(tMenu.display=='none')?"block":"none";』
の部分も、とても分かりやすいです。
少し書き足すだけでいいので、やってみますね。
子メニューはどうしても表示させたいわけではないのですが、
(だったらやらなければいいのですが＾＾；)＃２の方も
仰るように、初めから表示させておいて、訪問者の好みで
非表示にさせるという手もありますね。

回答ありがとうございました。とても参考になりました！

通報する

お礼日時：2006/09/17 11:12

No.2

回答者： BLUEPIXY
回答日時：2006/09/16 16:29

getElementById は、今頃のブラウザでは大抵使えると思いますが、

使えないブラウザでエラーになってしまうことが心配なら、
if(document.getElementById){//使える
}
の様にすればいいかもしれません。
また、スクリプトが動作しない環境（getElementByIdが使えない場合も含む）でメニューを開く方法がなくなるということに危惧があるなら、
デフォルトの状態を開いてある状態にして、onload で閉じるような感じにした方がいいのかもしれません。

- 0
- 件

通報する

この回答へのお礼

getElementByIdが大抵のブラウザで使用できるとのことなので、少し安心しました。
そうですね。if文を使うなどして、エラー回避をするのもいいかもしれません。
メニューは、どうしても開閉できないとダメ、というわけではないので、
もう少し考えてみることにしますね。

回答ありがとうございました。

通報する

お礼日時：2006/09/17 11:04