- ベストアンサー
javascriptのマウスイベントで画像を切り替えるプログラムがうまくいかない
- javascriptのマウスイベントに関して質問です。マウスが画像の上に乗ったら画像を切り替え、画像から離したら元の画像に戻すようなプログラムを作りたいのですが、うまくいきません。
- プログラムは以下のように作りました。どこが間違っているのかまったくわかりません。
- 画像切り替えのためのイベントハンドラを使っているので、イベントハンドラの設定方法に問題がある可能性があります。
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
とりあえずいま動かない原因から教えてあげないと。 document.gazoukirikae.src="./maru.gif;←ここ ダブルクォーテーションで閉じ忘れてます。 <html> <head> <title>画像切り替え</title> <script type="text/javascript"> <!-- function changeillustsikaku() { document.gazoukirikae.src="./sikaku.gif"; } function changeillustmaru() { document.gazoukirikae.src="./maru.gif"; } //--> </script> </head> <body> <h2>画像切り替え</h2> <div> <img src="./sikaku.gif" name="gazoukirikae" alt="四角" onMouseOver="changeillustmaru()" onMouseOut="changeillustsikaku()"> </div> </body> </html>
その他の回答 (2)
- babu_baboo
- ベストアンサー率51% (268/525)
だったら、これからのこともかんがえて、name を・・・ http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/struct/objects.html#h-13.2
- yambejp
- ベストアンサー率51% (3827/7415)
いまのままだと汎用性もないし、ちょっと工夫すればだいぶシンプルになりますね 例えばこんな感じ・・・ <script> function changeillust(obj,flg){ obj.src=flg?"2.jpg":"1.jpg"; } </script> <img src="1.jpg" onMouseOver="changeillust(this,true)" onMouseOut="changeillust(this,false)">