IE5.0以降のみ（Macintosh版IE5.0では正しく表示されない場合があります）
一定の時間ごとに画像が切り替わる処理に配列変数を使うと、ファイル名が連番でなくても処理させることができます。ここでは、画像をスライドショーのように自動的に切り替えて表示する方法を考えてみましょう。
最初に表示する画像にIDを設定します。
<IMG SRC="kaibosshi.jpg" ID=img1 WIDTH="357" HEIGHT="245">
ページの読み込みが完了した時に、画像を切り替えるための関数「slideshow()」を呼び出すように設定します。
<BODY onLoad="slideshow()">
配列変数を使って、画像を一定の時間ごとに切り替えて表示する処理を記述します。
<SCRIPT LANGUAGE="JavaScript">
<!--
var i=1;
var j=1;
picture=new Array();
for(i=1; i<=5; i++){
picture[i] = new Image();
};
picture[1].src = "kaibosshi.jpg";
picture[2].src = "gyuuitame.jpg";
picture[3].src = "happouhan.jpg";
picture[4].src = "toufu.jpg";
picture[5].src = "tubame.jpg";function slideshow(){
img1.src= picture[j].src;
j++;
if(j>=6){
j=1
};
setTimeout("slideshow()",1000);
}
//-->
</SCRIPT>この例では、まずpicture[1]に「kaibosshi.jp」、picture[2]に「toufu.jpg」のように、picture[ ]という配列変数に表示させたい順番に画像ファイルを格納しています。次に、「img1.src= picture[j].src」のようにスクリプトを記述し、変数[j]の値を変更することで配列変数に格納した画像を順番に切り替えて表示しています。この操作は、例041のようにファイル名に連番名をつけなくても、一旦配列変数に格納することで連番のように扱えるようにしていることがポイントです。
