WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:JavaScriptによる画像スワップについて。

0:[投稿] YK [2003/01/25 11:28 ][環境:IE6,WIN98 Apache]

JavaScriptを使って画像のスワップを行っています。
現在は、ボタン画像にマウスオンで任意の箇所に挿入した
画像をスワップさせているのですが、同時にボタン画像も
スワップさせたいのです。
が、1つのマウスアクションで1ヶ所の画像処理はできるのですが
複数箇所の画像を同時に変化させる方法がわかりません。
色々とサイトを回って調べてみたりしたのですが
当該の処理方法の解説が無く困っています。
どなたかご教示頂けませんでしょうか。

ソースは下記の通りです。

<SCRIPT Language="JavaScript">
<!--
if(document.images) {
var imgs = new Array();
imgs[0] = new Image();  imgs[0].src = "img/op_01.gif";
imgs[1] = new Image();  imgs[1].src = "img/op_02.gif";
imgs[2] = new Image();  imgs[2].src = "img/op_03.gif";
imgs[3] = new Image();  imgs[3].src = "img/op_04.gif";
imgs[4] = new Image();  imgs[4].src = "img/op_05.gif";

}

function chgimg(id, imgname) {
if(document.images) {
 if(imgs[imgname]) {
   document.images[id].src = imgs[imgname].src;
 }
 else {
   document.images[id].src = imgname;
 }
}
}
//-->
</SCRIPT>


<A href="catalog.html" onMouseOver="chgimg('img1', 1)" onMouseOut="chgimg('img1',0)"><IMG src="img/bu_catalog.gif" width="70" height="20" border="0">

<IMG name="img1" src="img/op_01.gif" width="360" height="110" border="0">


1:[回答] ひよこ [URL] [2003/01/26 11:41 ]

ボタンである画像にも nameを付けて置いて、chgimg()と同様のボタン画像切り替え関数を用意して、chgimg()からその関数を呼び出せばできませんか?


2:[回答] YK [2003/01/28 10:43 ]

ひよこさんレスありがとうございます。

で、概念としてそういう処理なんだろうなということは想像つくんですけど
実際のスクリプトの書き方がまったくわからない状態でして・・・
我流で色々やってみたんですが、成功しませんでした。

一回の動作(この場合あるボタン画像にマウスオーバーすること)で
二つの関数を呼び出すということがよくわかりません。
そのような処理をしている事例があれば何とかなるとは思うんで
どこかにサンプルになるような事例をご存知でしたらご教示頂けませんでしょうか。


3:[回答] Malic [2003/01/28 11:27 ]

2つ以上の関数呼ぶのは、並べて書くだけです。
例: onmouseover="chgimg1(); chgimg2();"


4:[完了] YK [2003/01/28 11:39 ]

ひよこさん、Malicさんありがとうございました。
おかげさまで解決しました。

なんだか、初歩的なことだったようで・・・
とにかくありがとうございました。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World