- ベストアンサー
JavaScriptでの画像ロールオーバーについて教えて下さい。
非常に初歩的な事で申し訳ありません。 サイトのメニュー部分の画像をJavaScriptでマウスオーバー時に切替たいのですが、うまくいきません。 IE6とOpera9ではすべて表示できたのですが、Firefox1.5では一部の画像だけ切り替えられませんでした。 原因が分からず困っています。 function chImg(img, str){ document.images[img].src = str;} よろしくお願いします。
- みんなの回答 (4)
- 専門家の回答
質問者が選んだベストアンサー
UPされたものを拝見しました。 文法上特におかしいところはありません。 マウスオーバーが効かないのは 製品案内のボタンひとつのみかと思います。 検討の結果imgタグの item というid名が良くないようです。 確かにjavascriptではitem()というオブジェクトがあります。 Ff、NNともに動きませんのでGeckoでは予約語なのかもしれません。 ともかく item を止めて、別のIDに変更してみてください。 .
その他の回答 (3)
- arenani_sorenani
- ベストアンサー率73% (58/79)
マウスオーバー部分のタグソースがなかったので chImg(img, str)のimgの渡し方がわからなかったのですが 補足のソースを見る限りではidを文字列として渡していますので 特に問題はないように思います。 <a>タグにonmouseoverを入れるのは全然普通で問題ありませんよ。 私の方では補足の書き方で FF1.5、NN7.1、IE7.0 問題なく表示します。 試しに以下のソースでFFで確認してください。 <script type="text/javascript"> function chImg(img,str){ document.images[img].src = "http://oshiete.goo.ne.jp/images/"+str; } </script> <body> <a href="#" onMouseover="chImg('id','h1/h1_50b.gif')" onMouseout="chImg('id','goo.gif')"> <img border="0" src="http://oshiete.goo.ne.jp/images/goo.gif" id="id" /></a> </body> .
お礼
確認してみましたところ問題なく表示できますね。 よろしくお願いします。
- arenani_sorenani
- ベストアンサー率73% (58/79)
#1です。 すみません'がぬけてました・・orz <script> function chImg(img, str){ img.src = str; } </script> <img src="img1.gif" onmouseover="chImg(this,'img2.gif')" > .
お礼
できました!ありがとうございます。 {document.images[img].src = str;}の書き方が問題だったのでしょうか。 それとも<img>タグではなく<a>タグにonmouseoverを入れていたのが問題だったのでしょうか。ソースは <a href="" onMouseover="chImg('id','img2.gif')" onMouseout="chImg('id','img1.gif')"><img src="img1.gif" id="id" /></a> 後学の為に教えて頂ければ幸いです。
- arenani_sorenani
- ベストアンサー率73% (58/79)
以下のようにしてみて下さい・・ <script> function chImg(img, str){ img.src = str; } </script> <img src="img1.gif" onmouseover="chImg(this,img2.gif')" >
お礼
ID変更でうまくできました! javascriptは勉強を始めたところで分からないまま、見よう見まねで組み込んでみたので、完全に落とし穴にはまってました。 本当にありがとうございました。