マウスと一緒に移動する画像
動作ブラウザ:[NS4]



 マウスの移動に合わせて画像も移動します。
 マウスの移動イベントはindow.document.captureEvents(Event.MOUSEMOVE)で取得できます。このイベントが発生した時に処理される関数名をwindow.document.onmousemove = 関数名のように記述すればマウスが移動するたびに関数が呼び出されます。呼び出された先の関数では引数として渡されたオブジェクト(ここではtheEvent)を参照することによりマウス座標を取得することができます。
 Netscape Navigatorではx,y,layerX,layerY,pageX,pageYの座標を取得できますが、この中でx,yに関しては挙動がおかしくなることがあります。このため、座標を取得する場合はpageX,pageY,layerX,layerYを使用するようにしてください。
 あと、STYLE属性かID属性でスタイルシートの指定を必ず行ってください。






■ソースリスト(ポイント部分)
<SCRIPT Language="JavaScript">
<!--
function attachImage(theEvent)
{
document.layers["myIMG"].left= theEvent.pageX;
document.layers["myIMG"].top = theEvent.pageY;
}
window.document.onmousemove = attachImage;
window.document.captureEvents(Event.MOUSEMOVE);

// -->
</SCRIPT>


<SPAN ID="myIMG" STYLE="position:absolute"><IMG SRC="sample1.gif"></SPAN>