*image Ver0.04


button1

button2


Imageオブジェクトを使った、ンタラクティブなボタン。
基本的な"onMouseOver"."onMouseOut"."onClick"の部分は、ImageVer.0.03と同じです。
通常状態のボタン(button0.gif)、マウスが上に来た時のボタン(button2.gif)、クリックされた時のボタン(button2.gif)の3種類のボタンの画像を使っています。
JavaScriptのimageオブジェクトは、HTMLで記述されている上から順番に"[0]"から始まる配列を作成します。
つまり、image Ver0.04の場合、
alt="button1"のSRCはdocument.images[0].srcで、
alt="button2"のSRCはdocument.images[1].srcで、
参照することが出来、それを利用してどのボタンに、マウスがきたか、マウスが離れたか、クリックされたか、を検出しています。
さらにボタンの数を増やす場合には、参照するimageオブジェクトの配列の添番が"[2]"."[3]"...、と変わっていきます。
て、解説しても解りにくいですね(^_^;;、すみません、imageオブジェクトに関しては、そのうちじっくりページをとって解説しようと考えています、その時までしばしのご猶予をお願いいたしますm(_ _)m。

[JavaScriptサンプルページに戻る]