- ベストアンサー
マウスオーバーで画像の入れ替え
- マウスオーバー時に画像の入れ替えをする方法
- IE6では動作するが、firefoxでは動作しない問題
- firefoxでも動作させるためのアドバイス
- dream_cats
- お礼率68% (26/38)
- JavaScript
- 回答数3
- ありがとう数2
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <script type="text/javascript"> <!-- // タイマー変数の初期化 timer = ""; // スワップイメージ function SwapImage(img) { obj = document.getElementById("image"); obj.src = img; clearTimeout(timer); timer=setTimeout('DefaultImage()',5000); } // イメージ画像の初期化 function DefaultImage() { obj = document.getElementById("image"); obj.src = 'img/default.gif'; clearTimeout(timer); } //--> </script> </head> <body> <div class="btn"><a href="#"><img src="img/Q3192812-1.png" onmouseover="SwapImage('img/Q3192812-1.png')" width="100" height="50" border="0" /></a></div> <div class="btn"><a href="#"><img src="img/Q3192812-2.png" onmouseover="SwapImage('img/Q3192812-2.png')" width="100" height="50" border="0" /></a></div> <div class="btn"><a href="#"><img src="img/Q3192812-3.png" onmouseover="SwapImage('img/Q3192812-3.png')" width="100" height="50" border="0" /></a></div> <div id="photo"><img src="img/Q3192812-4.png" id="image" width="300px" height="150px"></div> </body> </html> ファイル名を変えてみた。 で、原因は div#photoの子であるimg要素はname属性が指定されているから。 id属性で指定すれば動作する。
その他の回答 (2)
- himajin100000
- ベストアンサー率54% (1660/3060)
>なぜfirefoxでnameではだめでidでは動くのかがよくわからないので、 「Firefoxでは駄目」ではなくて それが「getElementByIdの正しい挙動」なの。 (name属性で取得できてしまうIEの方が誤り。 idで書くと「正しい」のでOperaやSafariでも動きます。)
お礼
ありがとうございます。 IEってシェアは多いけど、バグみたいなのも多いんですね。 ありがうございました。
- himajin100000
- ベストアンサー率54% (1660/3060)
あ、いけね 実験するときに >obj.src = 'img/default.gif'; を obj.src = 'img/Q3192812-4.png'; にし忘れた(汗
お礼
すばらしいです！ まさかこんな簡単に解決するとは思いませんでした。 name属性をid属性にしたら解決してしまいました。 ありがとうございます。 なぜfirefoxでnameではだめでidでは動くのかがよくわからないので、もし参考になるサイトがあれば教えていただけますか？ 今回は回答本当にありがとうございました。助かりました＾＾