- ベストアンサー
マウスイベントで画像を2つ変える
- 画像の上部にナビゲーションがあり、下部に画像があります。ナビゲーションAをクリックすると下部のB画像が表示されます。同時にA自身もクリックで画像が変わるという動作を実現する方法について教えてください。
- ナビゲーションAをクリックすると、下部の画像が変わります。また、ナビゲーションA自体もクリックで画像が変わるようにしたいです。このような動作を実現する方法を教えてください。
- 上部にナビゲーション、下部に画像があります。ナビゲーションAをクリックすると、下部のB画像が表示されます。同時にA自体もクリックで画像が変わるという動作を実現する方法について教えてください。
- JavaScript
- 回答数2
- ありがとう数6
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
よくわからないので、原理のみ。 （とりあえず、2箇所の画像が変わります） あとは適当にアレンジしてください。 <html> <head><title>test</title> <style type="text/css"> .navi img { width:150px; height:100px; } #target { width:450px; heigth:300px; } </style> <script type="text/javascript"> function change(e, a, b) { e.src = a; document.getElementById('target').src = b; } </script> </head> <body> <div class="navi"> <img src="A.jpg" onclick="change(this,'a.gif','a.png')"> <img src="B.jpg" onclick="change(this,'b.gif','b.png')"> <img src="C.jpg" onclick="change(this,'c.gif','c.png')"> </div> <img src="x.png" id="target"> </body> </html>
その他の回答 (1)
- yambejp
- ベストアンサー率51% (3827/7415)
AをクリックするとA→A', X→B CをクリックするとC→C', X→B' DをクリックするとD→D', X→B'' という仕様ですか？ またA→A'の状態でCをクリックするとき、A'→Aとしなくてもよいのですか？
お礼
ありがとうございます！ はい、A'→AとしなくてもしてもどちらでもOKです！ 今回は二番目の回答者さんの案で行けそうです。 またどうぞよろしくお願いします。
お礼
分かりづらい説明だったのに、 こんなに完璧に再現していただいてありがとうございます！ カンペキです！ ちゃんとやりたいことが再現できました。 ありがとうございました♪ またどうぞよろしくお願いします。