- 主な作品
オリジナルキャラクタを用いた作品の一例
オリジナルキャラクタを用いた作品の一例
Imageオブジェクトは、画像に関するオブジェクトです。
画像を扱う変数は必ず、このオブジェクト型を宣言する必要があります。
img=new Image();HTML文書上に表示されている画像はImageオブジェクト型の配列変数「document.images[]」に保管されています。
通常、配列変数「document.images[]」では、一番始めに出てきた画像を 0番目の要素として、以後順番に要素が割り当てられます。
すなわち、HTML文書中で 3番目に出てきた画像を参照したい場合は
document.images[2]となります。
番号の代りに、当該画像である<img>要素に属性で名前を与えておけば、それで参照する事も出来ます。
この場合、スクリプトでは、
document.画像名で指定の画像を扱えるようになります。
XHTML 1.0まででは、当該画像である<img>要素にname属性とid属性を与えます。
<img alt="代替文字列" name="画像名" id="画像名" width="横幅" height="高さ" src="URL/">
一方、XHTML 1.1以降では、<img>要素に対してname属性が廃止されたため、id属性のみの指定となります。
<img alt="代替文字列" id="画像名" width="横幅" height="高さ" src="URL" />
元々、JAVAスクリプトでは<img>要素に与えたname属性の値でどの画像かを選択するようになっておりました。
しかし、現在ではHTMLの標準化に依り、特定の要素を示すにはname属性ではなくid属性で指定する事が求められるようになりました。
但し、その場合旧式のブラウザでは画像を認識出来なくなるので、XHTML 1.0まででは旧来のブラウザ向けのname属性と現行のブラウザ向けのid属性の双方を記述する事を求めております。
XHTML 1.1以降では<img>要素にname属性が使えないため、スクリプトで画像を取扱う場合には注意が必要です。
id属性を画像名として認識しない旧型のブラウザでは、id属性で指定した画像名を認識出来ず、結果無意味なオブジェクトと見なされてエラーとなる場合があります。
このため、以下の方法で旧式ブラウザへの対策を行うと良いでしょう。
但し、HTML文書の画像を追加なり削除なりした場合に番号がずれる事は忘れないで下さい。
そこで、取扱いたい画像の初期状態のURIを document.images[] 各要素のImage.srcプロパティで検索して該当する要素の番号を変数に保存しておき、その変数で参照するようにします。
この方法なら、画像のURIを変更しない限りHTML文書中の画像の並びを変えても問題は起こらなくなります。
document.画像名 オブジェクトが有効であるかどうかを判断して、有効でなければ何もしないと言う形になります。
但しこの場合、スクリプトが動作しない場合の扱いについても検討する事となるでしょう。
画像のURLを表わします。このプロパティに新たなURLを書込めば、そのURLの画像に差し代わります。
document.images[]オブジェクトなど実際に表示している画像のオブジェクトに新たなURLを設定したい場合(すなわち表示画像を差替えたい場合)は必ず、Image型オブジェクトかdocument.imagesオブジェクトのsrcプロパティを入れて下さい。普通の文字列では表示されません。
img=new Image();// Image型オブジェクト変数にする。img.src="画像URL";// 画像URLをsrcプロパティに入れる。 // 実際に画像オブジェクトにURLをセットする。document.images[画像番号].src=img.src;// これではダメ。document.images[画像番号].src="画像URL";
Copyright ©平成15年-平成24年 さいたま・しらぎくさいと 版権所有
marguerite.site@gmail.com