現在このような記述でツリーメニューを作っています
trList = ["treeMenu1","treeMenu2","treeMenu3","treeMenu4","treeMenu5","treeMenu6","treeMenu7","treeMenu8"];
function exMenu(tName)
{
for (i=0; i<trList.length; i++) eval(trList[i]).style.display = "none";
tMenu = eval(tName).style;
if (tMenu.display == 'none') tMenu.display = "block"; else tMenu.display = "none";
}
本文は
<img src="sozai/menu1.gif" alt="矢印" width="13" height="13"><a href="javascript:exMenu('treeMenu1')">教会のご案内</a>
<div id="treeMenu1" style="display:none" class="font_menu2">
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_1_1.html" target="main">牧師・スタッフの紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_2_1.html" target="main">教会施設の紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_3_1.html" target="main">交通のご案内</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_4_1.html" target="main">教会QandA</a>
</div>
こんな感じです☆多少こちらで決めたタグなども入っていますが…。
テーブルを使って記述しています。
上記を見まして、「教会のご案内」をクリックするとメニューが出てきます。もう一度「教会のご案内」をクリックすると表示されたメニューが表示されていない状態に戻すように表示をしたいんです。
説明下手ですが、おわかりになる方タグなどを教えてくださいv(。・・。)
No.1ベストアンサー
- 回答日時:
みたかんじforでまわして全てnoneにしてから、チェックをいれているので
だめみたいですね。
例えばこんな感じで、forの前に変数に取っておけばよろしいかと。
(ちなみにevalでオブジェクトをつかもうとするのはさすがに
やめたほうがいいですよ)
<script>
trList = Array("treeMenu1","treeMenu2","treeMenu3","treeMenu4","treeMenu5","treeMenu6","treeMenu7","treeMenu8");
function exMenu(tName){
tMenu = document.getElementById(tName).style;
d = tMenu.display;
for (i=0; i<trList.length; i++){
if(document.getElementById(trList[i])) document.getElementById(trList[i]).style.display = "none";
}
if (d == 'none') tMenu.display = "block";
else tMenu.display = "none";
}
</script>
<img src="sozai/menu1.gif" alt="矢印" width="13" height="13"><a href="javascript:exMenu('treeMenu1')">教会のご案内</a>
<div id="treeMenu1" style="display:none" class="font_menu2">
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_1_1.html" target="main">牧師・スタッフの紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_2_1.html" target="main">教会施設の紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_3_1.html" target="main">交通のご案内</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9"><a href="kyoukai_4_1.html" target="main">教会QandA</a>
</div>
No.2
- 回答日時:
trList = ["treeMenu1","treeMenu2","treeMenu3","treeMenu4","treeMenu5","treeMenu6","treeMenu7","treeMenu8"];
window.onload=function(){
for (i=0; i<trList.length; i++) eval(trList[i]).style.display="none";
}
function exMenu(tName){
aaa=evel(tName)
for (i=0; i<trList.length; i++){
tMenu = eval(trList[i]);
if (aaa==tMenu&&aaa.style.display=='none') tMenu.style.display="block";else tMenu.style.display="none";
}
}
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS CSSのホバーエフェクト 1 2023/06/19 06:53
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- HTML・CSS img と p を縦中央に配置したいのですがうまくいきません。 2 2023/01/12 14:38
- PHP 共通の処理をまとめる方法がわからないのでアドバイスお願いします。 1 2022/12/19 20:20
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
画像のフェードイン・フェード...
-
デフォルト非表示にしたい。【t...
-
IMGタグごとにCSSを設定する方法
-
bxsliderで最初に縦に複数表示...
-
画像マウスオーバーで、checkb...
-
javascriptテキストBOX色を元に...
-
フォームに入力された値により...
-
MAX関数を使ってからLEFT JOIN...
-
1枚の画像をクリックすると複数...
-
自働生成される<div>タグに連番...
-
javascriptでフォーカスを当て...
-
指定したパスが現URLに含まれて...
-
jQuery bxSlider 画像に変更
-
removeAttribute()メソッドで削...
-
CSS <div>の入れ子が反映さ...
-
外部javascriptの重複を防ぐには
-
クリックすると下に説明文が出...
-
YouTubeをブログに貼る時、1つ...
-
リンク色を動的に変更したい。i...
-
離れた場所にマウスオーバーで...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
jQueryで同じクラス名のものを...
-
デフォルト非表示にしたい。【t...
-
スクリプト
-
jQueryで4枚の画像がフェードア...
-
交互に入れ替わる画像を複数配置
-
クリッカブルマップをロールオ...
-
bxsliderで最初に縦に複数表示...
-
複数bxsliderをタブで切り替え...
-
JavaScriptでの画像切り替えを...
-
「画像クリックで音声再生」を ...
-
画像切り替え
-
ボタンを押すたびに交互に切り...
-
jQuery 親要素の大きさに合わせ...
-
画像のフェードインについて・...
-
ボタンを画像に変更したい
-
画像のフェードイン・フェード...
-
アップロードファイルの種類に...
-
クリックでクリッカブルマップ...
-
Jquery cheeckbox(複数)とsli...
-
画像の切り替えについて
おすすめ情報
