| ポイント |
<![CDATA[
fName1 = new Array("a_btn", "a_load","a_pop", "a_push");
fName2 = new Array("b_page","b_pre", "b_self","b_top");
count++;
count %= 4;
document.btn1.src = fName1[count] + ".gif";
document.btn2.src = fName2[count] + ".gif";
<body onLoad="setInterval('changeImg()',2000)">
]]>
|
| 説 明 |
一定時間ごと画像を入れ替えるにはsetTimeout()かsetInterval()を使います。入れ替える画像のファイル名を工夫し「連番+拡張子」にしておきます。count++でカウントを増やし、count % = 4で剰余を求めます。4は表示する画像の枚数です。10枚あるならば10となります。すでに画像が用意されてしまっていてファイル名に規則性がない場合は、あらかじめ配列にファイル名を入れておきます。この配列内容をカウントの値をキーにして参照しファイル名として利用します。 |
| サンプル |
<![CDATA[
<html>
<head>
<title>一定時間ごと画像を入れ替える（複数箇所に異なる画像［不規則なファイル名版］）</title>
<script language="JavaScript"><!--
count = 0;
fName1 = new Array("a_btn", "a_load","a_pop", "a_push");
fName2 = new Array("b_page","b_pre", "b_self","b_top");
function changeImg()
{
count++;
count %= 4;
document.btn1.src = fName1[count] + ".gif";
document.btn2.src = fName2[count] + ".gif";
}
// --></script>
</head>
<body onLoad="setInterval('changeImg()',2000)">
<img src="a_load.gif" name="btn1">
<img src="b_top.gif" name="btn2">
</body>
</html>
]]>
|
| 補足説明 |
なし |
|
■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!
|
一定時間ごと画像を入れ替える（複数箇所に異なる画像［不規則なファイル名版］）