重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら>

【GOLF me!】初月無料お試し

IRAMです。

リンクをメニューで作っています。
リンクはテキストと画像共に張っています。

画像に触れると、画像が切り替わるという動作を
するソースを、
<a href="onsei.html"
onMouseOver="if(document.images)
IMAGE.src='Image/onsei_2sd.jpg'"
onMouseOut="if(document.images)
IMAGE.src='Image/onsei_s_mb.jpg'">
<IMG SRC="Image/onsei_s_mb.jpg" border="0" width=100 height=60 name="IMAGE">
</a>
としました。

実際に表示させて見ると、
確かにマウスを置いたときに画像が切り替わった
のですが、
この設定を2つ以上すると、
画像が切り替わらないのです。

マウスを置いたときに背景色が変わる設定は
それぞれのリンクごとにできました。
しかし背景が画像であるとき、
2つ以上の画像に設定すると動作しないのです。
つまり設定が一つの画像に対してのときだけ
動作します。

この場合はどのような対策を取れば
よろしいのでしょうか。
どなたか回答をお待ちしています。
よろしくお願い致します。

A 回答 (5件)

#4の方の回答の通り、名前を合わせないといけません。

    • good
    • 0
この回答へのお礼

はい、おっしゃるとおりに、直してみましたところ期待どおりの動作ができました。

お世話になりました。
ありがとうございました。

お礼日時:2005/02/06 22:28

#2で私が書いたとおり、下記の2箇所(「~~~」の部分)もIMAGE2,IMAGE3...と変えてください。


これらがimgタグのname(「^^^」の部分)と結びつきます。
ここがIMAGEをさしているので補足で仰る現象が出ます。

onMouseOver="if(document.images)
IMAGE.src='Image/hands5.jpg'"
~~~~~~~~
onMouseOut="if(document.images)
IMAGE.src='Image/hands1_2sd.jpg'">
~~~~~~~~
<IMG SRC="Image/hands1_2sd.jpg" border="0"
width=100 height=60 name="IMAGE2">
                    ^^^^^^^
    • good
    • 0
この回答へのお礼

おっしゃるとおりに、直してみましたところ期待どおりの動作ができました。
とても助かりました。
ありがとうございました。

お礼日時:2005/02/06 22:27

>IMAGE2、IMAGE3のところは動作がおかしくなってしまっています。


実際のソースがどうなっているか補足してくれませんか?

この回答への補足

IMAGE2↓
<Td Align="left" Valign="middle" Width="100" Height="60" BgColor="#FFD700">
<a href="tuuyaku.html" target="main"

onMouseOver="if(document.images)
IMAGE.src='Image/hands5.jpg'"
onMouseOut="if(document.images)
IMAGE.src='Image/hands1_2sd.jpg'">

<IMG SRC="Image/hands1_2sd.jpg" border="0" width=100 height=60 name="IMAGE2">

</a>

</Td>

IMAGE3↓
<Td Align="left" Valign="middle" Width="100" Height="60" BgColor="#FFD700">
<a href="sonota.html" target="main"
onMouseOver="if(document.images)
IMAGE.src='Image/hikidasi2_sv.jpg'"
onMouseOut="if(document.images)
IMAGE.src='Image/hikidasi.jpg'">
<IMG SRC="Image/hikidasi2_sv.jpg" border="0" width=100 height=60 name="IMAGE3">
</a>

</Td>
です。

<HEAD>環境内には以下のタグを書いています。
<SCRIPT language="JavaScript">
<!--
loadImage = new Image();
loadImage.src = "";
//-->
</SCRIPT>

よろしくお願いします。

補足日時:2005/02/06 19:49
    • good
    • 0

name="IMAGE"とされたタグが複数あるのが原因です。



あまりいいやり方ではありませんが、単純なやり方を書いておきます。
以下のように、Aタグの「IMAGE.src」とIMGタグの「name="IMAGE"」を、AタグとIMGタグのペアが登場する順にIMAGE1、IMAGE2、…というように番号を振ってみてください。

<a href="onsei.html"
onMouseOver="if(document.images)
IMAGE1.src='Image/onsei_2sd.jpg'"
onMouseOut="if(document.images)
IMAGE1.src='Image/onsei_s_mb.jpg'">
<IMG SRC="Image/onsei_s_mb.jpg" border="0" width=100 height=60 name="IMAGE1">
</a>

<a href="onsei.html"
onMouseOver="if(document.images)
IMAGE2.src='Image/onsei_2sd.jpg'"
onMouseOut="if(document.images)
IMAGE2.src='Image/onsei_s_mb.jpg'">
<IMG SRC="Image/onsei_s_mb.jpg" border="0" width=100 height=60 name="IMAGE2">
</a>

この回答への補足

質問しておきながら返事が遅くなってすみませんでした。

<SCRIPT language="JavaScript">
<!--
loadImage = new Image();
loadImage.src = "";
//-->
</SCRIPT>
を</head>の前に入れています。

IMAGE2、IMAGE3と違うふうに割り当ててみますと、動作がおかしくなってしまいました。

マウスを置いたら、画像が切り替わるようにしたかったのですが・・・。

補足日時:2005/02/05 15:11
    • good
    • 0

どんな風に書いてうまくいかなかったのか


補足で書いてくれますか?

質問文のIMGは別に背景というわけではありません。

この回答への補足

わざわざ返事してくださったのに、こちらの回答が遅れましてまことに申し訳ありません。

上でdeadlockさんが回答してくださったとおり、IMAGEの名前をそれぞれ別々に割り当ててみました。
そうすると、
<SCRIPT language="JavaScript">
<!--
loadImage = new Image();
loadImage.src = "";
//-->
</SCRIPT>
で指定しています。
IMAGEとわりあてた画像は動作したのですが、IMAGE2、IMAGE3のところは動作がおかしくなってしまっています。

IMAGE2をわりあてた画像にマウスをおくと、IMAGE2の画像ではなく、IMAGEの画像が、IMAGE2に変わってほしい画像に切り変わってしまいます。
IMAGE3をわりあてた画像にマウスをおいても同様で、IMAGEの画像だけが変わります。

補足日時:2005/02/05 15:20
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!