IE5.0以降のみ（Macintosh版IE5.0では正しく表示されない場合があります）
ページの背景画像を素早く切り替えると、背景が動いているような効果を与えることができます。ここでは、JAVA Scriptを使って、背景画像をアニメーション表示する方法を考えてみましょう。
ページの読み込みが完了した時のイベントを使って、背景の画像を切り替える関数の呼び出しを設定します。
<BODY BACKGROUND="../../assets/images/bg3-1.jpg" onLoad="bganimation()＞
JAVA Scriptを使って4枚の背景画像を順番に切り替えて表示する処理を設定します。<SCRIPT LANGUAGE="JavaScript">
<!--
var no=1;
function bganimation(){
document.body.background="../../assets/images/bg3-"+no+".jpg";
no++;
if(no>=5)
{
no=1;
}
window.setTimeout("bganimation()",150);
}
//-->
</SCRIPT>画像を切り替える時間間隔は、1000分の1秒単位で指定します。
例では、4枚の背景画像を切り替えて表示することで、背景をアニメーション表示しています。このスクリプトでは、関数が呼び出された回数を変数「no」を使ってカウントし、背景に表示するファイルを切り替えています。この時「bg3-1.jpg」「bg3-2.jpg」のように連番の名前がついている画像ファイルを変数「no」を使って「"bg3-"+no+".jpg"」のように設定しておくのがポイントです。この設定で、変数「no」の値が「1」の場合「bg3-1.jpg」という名前のファイルを表示することができます。
