PR
構文
 
 オブジェクト名 = new Image()
総合 インデックス
オブジェクト
Firefox IE

説明

  • Imageオブジェクトでは,new演算子を使って画像をオブジェクト化できる。
  • このオブジェクト化された画像は,スクリプトを使って操作できる。

用例

「IMG[1]」から「IMG[5]」までの5個の画像オブジェクトを作成し,それぞれのオブジェクトに画像の「src」の値を設定した後,その画像オブジェクトをブラウザに表示した「animation」というオブジェクト名を付けたimg要素に,一定時間ごとに順番に読み込むことにより,画像をアニメーションさせる。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>Image()</title>
<script type="text/javascript">
<!--
var ImageSetA = 1;
IMG = new Array();
IMG[1] = new Image();
IMG[2] = new Image();
IMG[3] = new Image();
IMG[4] = new Image();
IMG[5] = new Image();
IMG[1].src = "image1.jpg";
IMG[2].src = "image2.jpg";
IMG[3].src = "image3.jpg";
IMG[4].src = "image4.jpg";
IMG[5].src = "image5.jpg";
function anime_1() {
document.animation.src = IMG[ImageSetA].src;
ImageSetA++;
if(ImageSetA > 5) {
ImageSetA = 1;
}
setTimeout("anime_1()",1000);
}
//-->
</script>
<style type="text/css">
<!--
body { background-color: #ffffff; }
-->
</style>
</head>
<body onLoad="anime_1()">
*Imageオブジェクトの作成
<p>
<img src="image1.jpg" name="animation" alt="Animation" border="0"
width="100" height="100">
</p>
</body></html>

この用例を実行する

関連項目

-->Arrayオブジェクト 
-->Imageオブジェクト/srcプロパティ