画像をクリックして入れ替えたい

質問

画像の入れ替えが出来ずに困っています。教えて下さい。

3つの画像（1.gif）（2.gif）（3.gif）があります。
1.gifと2.gifは、ページを開いた時に、既に表示されるようにします。
2.gifの画像をクリックした時に、
1.gifの画像を3.gifの画像に入れ替えたいのですが、
どのようにすればよいでしょうか？

お手数ですが、おわかりになられる方がいらっしゃいましたら
どうぞ教えて下さい。
よろしくお願いいたします。

回答No.4

leaz024 · ベストアンサー

<IMG>タグは、onClickなどのイベントに対応していないブラウザがほとんどなので、押す方の画像（2.gif）を<A>～</A>タグで囲み、onClickを受け取れるようにします。

<IMG src="1.gif" name="img1" border="0">
<A href="" onClick="images.img1.src = '3.gif'; return false;">
　<IMG src="2.gif" border="0">
</A>

・<A>の機能でジャンプしないように、hrefの値をヌル（何も指定しない）にしておきます。
・またクリック時のJavaScriptからもジャンプしないように、return false;としています。（return true;とすると、飛ぶ）

お礼

できました！！！

ありがとうございます。
すっごくうれしいです。
こんなに単純でよかったんですね。
いろいろ調べて、ものすごい記述いっぱい書いたりしてしまいました。

ホントに助かりました。
ありがとうございました。

回答No.3

makokoko

こんな感じっすかね。

<img src="1.gif" id="img1">
<img src="2.gif" id="img2" onclick="img1.src='3.gif'">

未テストなので動かなかったらごめんネ！

お礼

ありがとうございます。
イメージはそうです！！

でも動きませんでした　(><)

回答No.2

yuizuian

zohさんのアドバイスと、この参考URLのアドバイスを合わせて応用させればできると思いますよ。

参考URL：

http://www.okweb.ne.jp/kotaeru.php3?q=114348

お礼

ありがとうございます。
でも、私にはちょっと難しくて・・・。

回答No.1

zoh

参考URLをご覧になって下さい。メニューの「イメージの変更」にサンプルがのっています。上にあるの「sample」ボタンで実際の動作を確かめられます。

参考URL：

http://www.cam.hi-ho.ne.jp/t-sue/js/main.htm

お礼

ご回答ありがとうございます。
クリックして画像を変更する、という項目ですね。
この方法で、クリックした画像ではなく、別の場所にある画像を
切り替えたいのですが、
この場合は、どのようにしたらいいのでしょうか？

ボタンの例など見ながらやってみたのですが、
うまくいきません。

お手数ですが、教えていただければ幸いです。

よろしくお願いいたします。