いつもお世話になっております。

以下のソースで表示される二つの画像にそれぞれ別のリンク先を設定したいのですが可能でしょうか?
できましたら複数になった場合も含めて教えていただけると助かります。

<IMG SRC="hoge1.gif"NAME="img">
<SCRIPT LANGUAGE="Javascript">
  var num=2;
  function timer(){
    if(document.img.complete){
    document.img.src="hoge"+num+".gif";
    num++;if(num>2)num=1;
    }
  setTimeout('timer()',3000);
  }
</SCRIPT>

回答の条件
  • URL必須
  • 1人3回まで
  • 登録:2008/01/11 11:08:25
  • 終了:2008/01/18 11:10:02

回答(4件)

id:blueberrystream No.1

KID the Euforia回答回数34ベストアンサー獲得回数52008/01/11 11:53:19

ポイント27pt

こんな感じでよろしいでしょうか?

<BODY onload="timer()">
<a href="hoge1.html" id="link"><IMG SRC="hoge1.gif" NAME="img"></a>
<SCRIPT LANGUAGE="Javascript">
<!--
var num = 2;

function timer(){
    if (document.img.complete) {
        document.img.src = "hoge" + num + ".gif";
        // リンク先変更
         document.getElementById('link').href = "hoge" + num + ".html";
        num++;
        if(num > 2) {
            num = 1;
        }
    }

    setTimeout('timer()', 1000);
}
//-->
</SCRIPT>
</BODY>

IE6 SP2とFireFox2.0.0.9で動作確認しました。


http://dummy

id:mika555

こんにちは、回答ありがとうございます。

飛ばしたい二つのURLが既存なものなのでこの方法だとダメのようです。

ドメインも別なので・・・・

また思いついたら回答いただけたら幸いです。

2008/01/11 12:47:01
id:fumiko_t No.2

fumiko_t回答回数2ベストアンサー獲得回数02008/01/11 13:12:33

ポイント27pt

blueberrystream さんの回答をもとに手をくわえました。



<BODY onload="timer()">

<a href="http://www.hatena.ne.jp/" id="link"><IMG SRC="hoge1.gif" NAME="img"></a>

<SCRIPT LANGUAGE="Javascript">

<!--

var num = 2;

function timer(){

if (document.img.complete) {

document.img.src = "hoge" + num + ".gif";

// リンク先変更

document.getElementById('link').href = "http://q.hatena.ne.jp/";

num++;

if(num > 2) {

num = 1;

document.getElementById('link').href = "http://www.hatena.ne.jp/";

}

}

setTimeout('timer()', 3000);

}

//-->

</SCRIPT>

</BODY>


どうでしょうか?

id:blueberrystream No.3

KID the Euforia回答回数34ベストアンサー獲得回数52008/01/11 13:24:42

ポイント26pt

document.getElementById('link').href は <a href="hoge1.html" id="link"> の

href属性の中身を指しています。なので、

document.getElementById('link').href = "hoge" + num + ".html";

の "hoge" + num + ".html" を変更すれば飛ばしたいURLを変更できます。


もしかしたら、こっちのほうがわかりやすいかもしれません。

<BODY onload="timer()">
<a href="http://h.hatena.ne.jp/" id="link"><IMG SRC="hoge1.gif" NAME="img"></a>
<SCRIPT LANGUAGE="Javascript">
<!--
var num = 2;

function timer(){
    if (document.img.complete) {
        document.img.src = "hoge" + num + ".gif";

        // リンク先変更
         //document.getElementById('link').href = "hoge" + num + ".html";
        switch (num) {
            case 1: // hoge1.gifのとき
                document.getElementById('link').href = "http://h.hatena.ne.jp/";
                break;
            case 2: // hoge2.gifのとき
                document.getElementById('link').href = "http://q.hatena.ne.jp/1200017304";
                break;
            default:
                // なにもしない
        }

        num++;
        if(num > 2) {
            num = 1;
        }
    }

    setTimeout('timer()', 3000);
}
//-->
</SCRIPT>
</BODY>

それと、最初の回答のソースで…

setTimeout('timer()', 1000);

3000から1000に変更してました。


http://dummy

id:Mook No.4

Mook回答回数1312ベストアンサー獲得回数3912008/01/11 13:39:36

ポイント10pt

定義したデータを順番に表示する例です。

データが増えた場合は、Array の部分を追加すればそのまま動くかと思います。

<html>
<header>
</header>
<SCRIPT LANGUAGE="Javascript">

var num=0;
var img_data = Array(
//       画像ファイル名 /  URL リンク
	Array( "hoge1.jpg", "http://www.yahoo.co.jp" ),
	Array( "hoge2.jpg", "http://www.google.co.jp" ),
	Array( "hoge3.jpg", "http://hatena.ne.jp" ) );

function timer(){
    if ( document.getElementById('img_obj') != null ) {
        if ( document.getElementById('img_obj').complete == false ) return;
    }
    document.getElementById('img_area').innerHTML
         = "<a href=\"" + img_data[num][1] + "\"  target=\"_blank\">"
         + "<img id=\"img_obj\" src=\"" + img_data[num][0] + "\"></a>";
    if( ++num >= img_data.length ) num=0;
    setTimeout('timer()',3000);
}

</SCRIPT>
<body onload="timer();">
<div id="img_area"></div>
</body>
</html>

http://www.openspc2.org/JavaScript/JavaScript_DOM/

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません