onMouseOverで画像を変えるには?

[上に] [前に] [次に]
わたべ [E-Mail] 1999/09/28(火) 13:35:50
こんにちは、初めまして。
同様の質問が何度もあるようですが・・・、すいません応用できないので教えて下さい。

http://www.geocities.co.jp/Hollywood-Kouen/1638/imagetest/imagetest.html
のようなページで、

・マウスの触れた箇所と、下の大きな画像を同時に変更したい
 (image1.GIF→image2.GIF)
・下の大きな画像はサイズが大きいので、読み込んでからページを表示させるようにしたい

ということをしたいと思っています。
どなたかご指導下さい。

Nobu3 [E-Mail] [HomePage] 1999/09/29(水) 03:43:00
きっとそのままで使えます。
../199907/99070186.htm

>同様の質問が何度もあるようですが・・・、すいません応用できないので教えて下さい。
まあ、そう言わず頑張ってください。
「onmouseover image」でも色々とでます。

Nobu3 [E-Mail] [HomePage] 1999/09/29(水) 03:44:12
>「onmouseover image」でも色々とでます。
あ、「このラウンジの検索で」です。

わたべ [E-Mail] 1999/09/29(水) 11:51:55
Nobu3さんありがとうございました。
しかし、お教えいただいた
 ../199907/99070186.htm
のスクリプトでは、

・マウスの触れた箇所と、下の大きな画像を(!)同時に(!)変更する
・大きな画像を読み込んでからページを表示させる

のようなことがわかりません。
わたしのやり方がわるいのでしょうか?

マウスを触れた箇所以外の画像を変えるというのはわかりましたが・・・

Nobu3 [E-Mail] [HomePage] 1999/09/29(水) 12:42:58
勝手に引用します。
function mouseOn(n, which){
if(which=="back") document.images["BackButton"+n].src = "back2.GIF";
if(which=="next") document.images["NextButton"+n].src = "next2.GIF";
}
となっていますが、やってる事は理解できていますか?

同時に変更するには、nextか、backの時に、先ほどの例を追加して書けばできます。例えば、
if(which=="back"){
document.images["BackButton"+n].src = "back2.GIF";
document.images["Big"].src = "image2.GIF";
}
で、大きい画像は名前を「Big」にする。

リンク先にあるスクリプトの「img1 = new Image(); img1.src = "image/xxx1b.gif";」が、先読みの部分だと思うんですけど。
なにか違ってましたか?
http://www.tohoho-web.com/wwwxx001.htm
でも、使っている方法のはずです。

長月 1999/09/29(水) 13:12:46
>・大きな画像を読み込んでからページを表示させる

HTML文は、先に読み込まれているので、ブラウザで表示されます。
その間、画像の読込も並行で処理しているので、画像をすべて読み
込まないとページが表示されないようにするというのは、別の方法
を使わないとだめだと思います。
でも、画像を全部、読込むまで、真っ白な画面でいるのもいやですが。

画像、読込ページは、真っ白なページにして、読込が終了したら、
別のページに飛ばすとか。 画像の読込が終了するまで、「読込中」
という表示を出すか。。。。他の方法もあると思うけど。

わたべ 1999/09/29(水) 18:57:48
[[解決]]
nobu3さん、長月さん、ご回答ありがとうございました。

>if(which=="back"){
>document.images["BackButton"+n].src = "back2.GIF";
>document.images["Big"].src = "image2.GIF";
>}
>で、大きい画像は名前を「Big」にする。
↑これが知りたかったんです、ありがとうございました。

やってることが理解できれば応用できるようになりますね。
これを機会に頑張ります。

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