マウス座標を表示する(ページ内に)


動作ブラウザ 【 IE:5.0  NN:-  Safari:1.0
Internet Explorer Netscape Navigator Opera iCab Safari
3.0x 4.0x 4.5 5.0x 5.5 6.0 2.0x 3.0x 4.0x 4.x 6.0 7.0 6.0 7.0 2.x 1.0 1.1 1.2
Windows × × - × × × × × × × × - - - -
Macintosh × × × - - × × × × × × × × ×
UNIX - - - - - - × × × × × × × × - - - -

説  明 マウスのXY座標をマウスの右下に表示します。グローバル変数名としてoを使っているので、場合によっては不具合が発生するページがあるかもしれません。
サンプル <html>
<head>
<title>マウス座標を表示する(2)</title>
</head>
<body>
マウス座標を表示するブックマークレットです。<br>
マウスの位置を
<a href="
javascript:o=document.body.appendChild(document.createElement('div'));o.style.position='absolute';o.style.top='0px';o.style.left='0px';o.style.backgroundColor='yellow';o.style.width='80px';o.style.height='20px';o.style.zIndex=9999;document.body.onmousemove=function () {o.innerHTML=event.x+','+event.y;status=event.x+','+event.y;o.style.left=event.x+16;o.style.top=event.y+16;};">マウス座標を表示</a>
します。
</body>
</html>
補足説明 なし

■サンプルスクリプトを実行する >>実行
■各ブラウザでの動作結果を見る >>View!

写真素材 PIXTA