マウス操作による画像変更



0   名前: 旋風 : 2007/01/29(月) 09:26  ID:cyVPZSRF sub-M4
何度もすみません、再びご助力お願いいたします

【何をしたいのか】
画像の上にマウスを置くと画像が変わり、さらにクリックすると別の画像へ変わり、インラインフレームの中がそのリンクに変わるというものです

【現在の状況】
とりあえずいろんなサイトを参考にし、画像ひとつなら変わるようになりました
ですが、二つになると1の画像は普通に動くのですが、2の画像の上にマウスが来ると1のほうが2の画像に変わってしまいます

【何をしてみたのか】
<html>
<head>
<title>テスト</title>

<Script Language="JavaScript1.1">
<!--
function SetIcon(){};
function SetIcon2(){};

var b=0;
var b2=0;


icon=Array(3);
icon[0]=new Image();icon[0].src="a.gif";
icon[1]=new Image();icon[1].src="b.gif";
icon[2]=new Image();icon[2].src="c.gif";
function SetIcon(flag){
var a=flag;
if(a==2){
b=1
}
if((a!=2)&&(b==1)){
}else{
document.images[0].src=icon[flag].src;
}
}
icon2=Array(3);
icon2[0]=new Image();icon2[0].src="aa.gif";
icon2[1]=new Image();icon2[1].src="bb.gif";
icon2[2]=new Image();icon2[2].src="cc.gif";
function SetIcon2(flag2){
var a=flag2;
if(a==2){
b2=1
}
if((a!=2)&&(b2==1)){
}else{
document.images[0].src=icon2[flag2].src;
}
}
//-->
</Script>
</head>
<body>

<A href="#" onMouseOver="SetIcon(1)" onMouseOut="SetIcon(0)" onClick="SetIcon(2)">
<img src="a.gif" alt="icon"></A>
<A href="#" onMouseOver="SetIcon2(1)" onMouseOut="SetIcon2(0)" onClick="SetIcon2(2)">
<img src="aa.gif" alt="icon2"></A>
</body>
</html>

【備考】
とりあえずリンク等は気にしないで画像がきちんと変わるようにしたいと思っております

1   名前: 旋風 : 2007/01/29(月) 09:26  ID:cyVPZSRF sub-M4
追記
Javaスクリプトに関して初心者で、よくわかってない部分が多々あると思いますがよろしくお願いします

2   名前: NullPo : 2007/01/29(月) 09:26  ID:Z0FHbpib sub-ii
SetIcon2関数の
>document.images[0].src=icon2[flag2].src;
が、document.images[1].src=icon2[flag2].src;
だと思える。
試してないけど、パっと見。

3   名前: 匿名 : 2007/01/29(月) 09:26  ID:ittaUsD7 sub-Ds
cssでインラインにリンク。
hoverとactiveを使用。
classかidで個別対応ではどう?

4   名前: 旋風 : 2007/01/29(月) 09:26  ID:cyVPZSRF sub-M4
風邪で寝込んでいたため、返事が大変遅くなりました
申し訳ありません

>>NullPo様
その通りでした
こんな簡単なことに気づかず、情けない限りです(TT
的確な指摘まことにありがとうございます

>>匿名様
CSSはまったく触ったことがないのですが、できる限り試してみようと思います
アドバイスまことにありがとうございました

解決できましたのこの質問は終了させていただきます
ありがとうございましたm(_ _)m

一覧へ戻る