お世話になっております。
下記URLサイト
http://www.css-lecture.com/log/javascript/009.html
のプルダウンを行ないたく、実装してみたものですが、
メニューバーにある各ボタンにリンクを設置すると
ページ遷移後にメニューバーにあるボタンが?となって認識されません。。
表示されないボタンですが、
例えば、
5つのボタンで、
それぞれ、
Aボタン→01.html
Bボタン→02.html
Cボタン→03.html
Dボタン→04.html
Eボタン→05.html
リンクしているボタンがあるとしますと、
Aボタンを押して01.htmlに遷移した時は、Aボタンのみ表示されず、Bボタンを押して02.html遷移した時は、Bボタンのみ表示されません。
ソースはそのimgファイルをとって来ているのですが、なぜ表示されないのかがわからず、困っています。
どうか、ご教授お願い致します。
No.1ベストアンサー
- 回答日時:
ご質問文からだと事象だけしかわかりませんので…
>ページ遷移後にメニューバーにあるボタンが?となって認識されません
ということは、最初のメニュー(?)はちゃんと動作しているのですよね?
遷移後のページを直接開いても同じ、状態でしょうか?(多分そうだと思いますが)
スクリプトの問題というより、設定の問題のように思われます。
最初のページと、遷移後のページのメニュー部分を比較して、同じになっているかを確認してみてください。
あるいは遷移後のページの階層が深くなっていたりすると、画像の相対URLが変わるなどするはずですが、きちんと合っていますか?
「?」表示になるということなので、画像のURLが間違っている可能性が大だと想像されますが、構成など不明なので、あくまでも想像です。
この回答への補足
お返事ありがとうございます。
01~5.htmlまでは同階層にあり、再読込みなどでも表示されないままです。
なぜだか、ローカルテストをすると、ボタンが消えてしまう現象はおきません。
以下は01.htmlのメニュー部分のソースになります。
<div class="menu_navi">
<ul id="globalNavi">
<li><a href="01.html"><img src="img/btn/menu/css.gif" alt="CSS" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="01.html">CSS テクニック</a></li>
<li><a href="01.html">CSS ハック</a></li>
<li><a href="01.html">CSS テンプレート</a></li>
<li><a href="01.html">CSS レイアウト</a></li>
</ul>
</li>
<li><a href="02.html"><img src="img/btn/menu/web_design.gif" alt="Web Design" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="02.html">アイコン素材</a></li>
</ul>
</li>
<li><a href="03.html"><img src="img/btn/menu/javascript.gif" alt="Javascript" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="03.html">ロールオーバー</a></li>
</ul>
</li>
<li><div><img src="img/btn/menu/flash.gif" alt="Flash" class="btn" width="180" height="40" /></div>
<ul>
<li class="first"><a href="03.html">Action Script </a></li>
</ul>
</li>
<li><a href="03.html"><img src="img/btn/menu/mt.gif" alt="Movable Type" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="03.html">プラグイン</a></li>
<li><a href="03.html">テンプレート</a></li>
</ul>
</li>
</ul>
</div>
以下は遷移後の03.htmlのソースになります。
<div class="menu_navi">
<ul id="globalNavi">
<li><a href="01.html"><img src="img/btn/menu/css.gif" alt="CSS" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="01.html">CSS テクニック</a></li>
<li><a href="01.html">CSS ハック</a></li>
<li><a href="01.html">CSS テンプレート</a></li>
<li><a href="01.html">CSS レイアウト</a></li>
</ul>
</li>
<li><a href="02.html"><img src="img/btn/menu/web_design.gif" alt="Web Design" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="02.html">アイコン素材</a></li>
</ul>
</li>
<li><a href="03.html"><img src="img/btn/menu/javascript.gif" alt="Javascript" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="03.html">ロールオーバー</a></li>
</ul>
</li>
<li><div><img src="img/btn/menu/flash.gif" alt="Flash" class="btn" width="180" height="40" /></div>
<ul>
<li class="first"><a href="03.html">Action Script </a></li>
</ul>
</li>
<li><a href="03.html"><img src="img/btn/menu/mt.gif" alt="Movable Type" class="btn" width="180" height="40" /></a>
<ul>
<li class="first"><a href="03.html">プラグイン</a></li>
<li><a href="03.html">テンプレート</a></li>
</ul>
</li>
</ul>
</div>
仮に01.htmlから、<a href="03.html">のリンク先へ飛ぶと
<a href="03.html"></a>部分で囲まれた画像が表示できなくなってしまいます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- アプリ Edgeを操作するアプリについて 4 2023/05/11 22:48
- JavaScript スマフォではボタンを表示させたくない 2 2023/01/20 14:26
- Java Javaプログラミングの質問になります。 ボタンを押下した時に画面遷移して 画面から戻ってきた時のi 1 2023/06/26 07:50
- JavaScript ①入力フォーム→②確認表示画面→③送信完了画面のコードを書いているのです、 入力フォームから受け取っ 2 2022/05/10 16:45
- Visual Basic(VBA) 【ExcelVBA】動的にボタン、ボタン名を生成できますか? 7 2022/04/08 12:54
- 企画・マーケティング ウェブ広告の無意味な「×」ボタンは規約や消費者保護関連の法律の違反には当たらないですか? 画面上にデ 2 2023/06/18 19:21
- gooブログ Twitterの動画画面をgooブログに埋め込めない 4 2022/06/03 16:40
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- JavaScript jsで診断コンテンツのページ内切り替えについて 1 2023/04/14 17:31
- Visual Basic(VBA) Edge操作のアプリが例外発生に 1 2023/03/12 21:22
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
HTMLボタンの文字色を変え...
-
inputのtextとsubmitの高さがズ...
-
メールフォームでの送信確認か...
-
submitボタンにvalue属性の値で...
-
htmlで画面遷移させたい
-
[]を付けずにcheckboxの値を複...
-
Dreamweaver4でのクローズボタン
-
リンクでPOSTデータを送信する...
-
ボタンのなかに表示する文字を...
-
プルダウンと実行ボタンの色を...
-
<form>中の<button>タグのv...
-
ハイパーリンクをインプットボ...
-
DataGridViewのチェックボック...
-
エクセルVBAで画面の大きさを取...
-
チャレンジタッチの画面にスマ...
-
Q&Aフォームを作成したいのです...
-
Accessの画面更新を一時的に停...
-
別ブラウザにセッションを渡す...
-
Webページ上のボタン等の位置を...
-
aspxをhtmlに変換する方法について
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
HTMLボタンの文字色を変え...
-
submitボタンにvalue属性の値で...
-
checkboxとlabelがずれる
-
リンクでPOSTデータを送信する...
-
getParameterで値が取得できず...
-
SUBMITボタンを表示させないでS...
-
<FORM> </FORM> の中に さらに...
-
ボタンのなかに表示する文字を...
-
formでのtarget="_blank"2回目
-
INPUTのボタン周囲のスペース
-
戻ると、記入フォームの内容が...
-
チェックボックスの値をコピー
-
ボタンをクリックした時に、入...
-
HTMLのKEYとVALUE...
-
HTML ラジオボタン nameの大文...
-
HTMLでのid とnameの違い
-
formの送信ボタンをテキストに...
-
<form>中の<button>タグのv...
-
グーグルマップの文字化けで困...
-
input button の文字の色を2色...
おすすめ情報