■ マウスにくっつく画像（マウスストーカー）

マウスのイベントとしてマウスを移動した時のイベントを取得し、特定の処理を実行させます。

「Javascriptサンプル」−「マウスの座標取得」でマウスの座標を逐次取得することができました。
これを利用すればマウスにくっつく画像（マウスストーカーと言うらしいです。）が作成できます。

◆ 実行サンプル

このサンプルではここに記述するものはありません。

星がマウスにくっつくよ！！

【記述サンプル】

まず、テキストエディタなどを使用し、次の記述を「mpgrph1.js」というファイル名で保存します。
Wx = -1; Wy = -1; spannam1="span1"; divnam1="div1"; if (document.layers) document.captureEvents(Event.MOUSEMOVE); document.onmousemove = m_pos; function m_pos(event0) { if (navigator.appName.charAt(0)=="M") { Et =event.type; Sx =event.screenX; Sy =event.screenY; Wx = document.body.scrollLeft+event.clientX; Wy = document.body.scrollTop+event.clientY; } if (navigator.appName.charAt(0)=="N") { Et =event0.type; Sx =event0.screenX; Sy =event0.screenY; Wx =event0.pageX; Wy =event0.pageY; } txt0=""; txt0+="マウスの座標"; txt0+=" : X = "+Wx; txt0+=" : Y = "+Wy; if (navigator.appName.charAt(0)=="M") { document.all[divnam1].style.pixelLeft = Wx; document.all[divnam1].style.pixelTop = Wy+15; } if (navigator.appName.charAt(0)=="N") { document.layers[divnam1].x = Wx; document.layers[divnam1].y = Wy+15; } }

次に、HEAD句内にJavascriptの呼び出しを次のように記述します。
<script type="text/javascript" src="mpgrph1.js"></script>

そして、テキストを記述した次のようなレイアウト枠（レイヤー）を「body」タグの直後ぐらいに記述します。 <div id="div1" style="position:absolute;left:0;top:0;color:red; visibility: hidden;"> <img src="../../images/sample/star1.gif"> 星がマウスにくっつくよ！！ </div>