- ベストアンサー
マウスを乗せると画像が変わるようにしたいです。
初心者でわからないので教えてください。 javascriptを使用して左にある画像をマウスオーバーをすると右の画像が変わる方法を教えてほしいです。 たとえば 赤 青 ここの画像を変更 黄 このように 左に上から赤青黄と並んでいる画像があって、 その右に変更したい画像があるときにどうすればいいのかわからずに 困っています。 どうぞよろしくお願いします。
- taabooo
- お礼率46% (20/43)
- JavaScript
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
サンプルです。 余計なものは書いていないので、 imgのsrcやwidth,height imgのレイアウトなどを追加して応用してみてください。 <html> <head> <title></title> <script type="text/javascript"> function SAMPLE(onid,offid){ document.getElementById(onid).style.display = ''; document.getElementById(offid).style.display = 'none'; } </script> </head> <body> <img alt="赤" onmouseover="SAMPLE('R','W')" onmouseout="SAMPLE('W','R')"> <img alt="青" onmouseover="SAMPLE('B','W')" onmouseout="SAMPLE('W','B')"> <img alt="黄" onmouseover="SAMPLE('Y','W')" onmouseout="SAMPLE('W','Y')"> <img id="W" alt="元の画像"><img id="R" alt="赤の時" style="display:none;"><img id="B" alt="青の時" style="display:none;"><img id="Y" alt="黄の時" style="display:none;"> </body> </html>
お礼
ありがとうございます。 完璧に出来ました。 今いろいろ試して勉強させてもらっています。