ある画像の上にマウスを置くと他の画像が変わるようにするには?

[上に] [前に] [次に]
みや 1999/07/19(月) 13:58:04
マウスを乗せると画像が変わるスクリプトがアラカルトの中で説明されていますが、
ある画像にマウスを乗せると、マウスを乗せた画像以外の画像を入れ替えるにはどうしたら良いでしょうか。
また、マウスを乗せた画像とともに、別の画像も入れ替えるにはどのようにしたらよいのか教えて下さい。

zizz... [HomePage] 1999/07/19(月) 16:44:11
img1に触れた時、img2の画像を変える場合

---------- ここから ----------
<HTML>
<HEAD>
<TITLE>マウスを乗せると絵が変わる</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
if (document.image) {
img1 = new Image(); img1.src = "image/xxx1b.gif";
img2 = new Image(); img2.src = "image/xxx2b.gif";
}
function setImage(img, image) {
if (img) {
  img.src = image;
}
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<A HREF="xxx.htm"
onMouseOver="setImage(document.img2, 'image/xxx1b.gif')"
onMouseOut="setImage(document.img2, 'image/xxx1a.gif')">
<IMG NAME="img1" SRC="image/xxx1a.gif" BORDER=0></A>

<IMG NAME="img2" SRC="image/xxx2a.gif" BORDER=0>
</BODY>
</HTML>
---------- ここまで ----------

みか 1999/12/05(日) 11:23:56
過去の質問で質問なんですが
×××.htm
の×の所には何を入れればいいのですか?
初心者の質問ですみません。

P初心者 1999/12/05(日) 13:37:24
いえいえ、私もP初心者です!

<A HREF=〜>タグを使用しているのでXXX.htmが必要なだけで
<DIV>や<SPAN>のタグ内にonMouseOverやonMouseOutを指定すれば大丈夫だと思います!

zizz... [HomePage] 1999/12/05(日) 18:12:18
> ×××.htm
> の×の所には何を入れればいいのですか?
マウスを持ってくる画像をクリックしたとき、どこかに飛びたいのならそのURL。
どこにも飛びたくないのなら、
<A HREF="#"  --略--  >
とすると良いでしょう。

<A HREF="javascript:void(0)" --略--  >
も良いかと思ったけど、void operatorはJavaScript 1.1で実装されたものだし、
JavaScriptが無効な場合困るし、
馬鹿なロボットが機械的にURLを作って取りに来るので、
お勧めしません。

> <A HREF=〜>タグを使用しているのでXXX.htmが必要なだけで
> <DIV>や<SPAN>のタグ内にonMouseOverやonMouseOutを指定すれば大丈夫だと思います!
AタグへのonMouseOver, onMouseOutはNetscape Navigator 3.0, MSIE 4.0以上でサポートされているのに対し、
DIVタグやSPANタグへのonMouseOver, onMouseOutは、同5.0, 4.0以上でしかサポートされていません。
Aタグを用いたほうが良いでしょう。

杉山 [HomePage] 1999/12/05(日) 20:09:53
>どこにも飛びたくないのなら、
><A HREF="#"  --略--  >
>とすると良いでしょう。

NN4の場合、クリックするとそのページの先頭に飛んでしまいます。
いい方法はないでしょうか。
return falseみたいのがあった様な気がしますが、
これは関係ないんでしたっけ?

みか 1999/12/05(日) 23:23:15
アドバイスありがとうございます
そこでまた初心者の質問なんですが
もし「new.gif」をマウスを載せない時に設定する場合
「new1.gif」がマウスを載せた時に設定するには
どこにどれを設定すればいいのでしょうか????
もしxxx1b.gifのに入れる場合「new.gif1b.gif」という
感じでそのまま載せてしまっていいのですか?

ほんとに初心者がそんなことするな!と言いたい方もいらっしゃると
おもいますがどうしてもどうしてもやりたいのです
お願いします。   すみません

Mugi [E-Mail] [HomePage] 1999/12/06(月) 00:14:36
マウスを乗せたときの画像。
onMouseOver="setImage(document.img2, 'new1.gif')"
乗せないときの画像は
<IMG NAME="img2" SRC="new.gif" BORDER=0> と
onMouseOut="setImage(document.img2, new1.gif')">
の二個所。

ふじ 1999/12/06(月) 01:30:40
> NN4の場合、クリックするとそのページの先頭に飛んでしまいます。
> いい方法はないでしょうか。
<A href="#" onClick="return false;" onMouseOver(以下略)

で、どうです?

P初心者 1999/12/06(月) 10:39:27
zizz..さん、ふじさん、勉強になりました!

ところで、href="#" の#って、どういう意味ですか〜

Mugi [E-Mail] [HomePage] 1999/12/06(月) 11:06:36
> ところで、href="#" の#って、どういう意味ですか〜
ページ内の指定した場所にジャンプするときに使います。
#だけだと、ページの最初にジャンプします。
ここのNAME属性の説明を見てください。
http://www.tohoho-web.com/html/a.htm

P初心者 1999/12/06(月) 11:23:09
Mugiさん、わかりました!
ありがとう!

ラウンジも楽しいけど、ご自分の掲示板レスもしなきゃ〜
(よけいなお世話でした!)

徒歩 1999/12/09(木) 17:31:47
<A onClick="return false;" onMouseOver(以下略)
でどうです?

ふじ 1999/12/09(木) 18:23:10
><A onClick="return false;" onMouseOver(以下略)
href がないと、NN ではクリックしてもなにも起きないのですよ。
IE だと大丈夫なんですけどね。

ふじ 1999/12/09(木) 18:38:38
>クリックしても
マウスを上に乗せても、の間違いです。
失礼。

徒歩 1999/12/09(木) 18:44:24
そうですね。
NNだと確かにそうです。
追記不足でした。
失礼。

[上に] [前に] [次に]