マウスポインタの座標値をタイトルバーに表示するスクリプトを作りました。
タイトルバーを見て下さい。タイトルの左端に(X,Y)の形式で、マウスポインタのページ内座標値が表示されています。
Internet Explorer 4.0 以降でブラウズできます。残念ながら Netscape では見ることができません。
（NetscapeでもOKなスクリプトファイルはこちら・・・）
こんなものを何に使うかはあなた次第です。
私は、ページレイアウトのときに、オブジェクトの位置関係を確かめるために使っています。
ページが完了したら、1行だけ削除すれば良い。便利ですよ。
座標表示のスクリプトは・・・
var X = Y = 0;
var ttl = document.title;
function posXY() {
if (document.all) {
X = event.offsetX; Y = event.offsetY;
}
else return;
document.title = " (" + X + "," + Y + ") " + ttl;
}
if (document.all) {
document.onmousemove = posXY;
document.body.style.cursor = "crosshair";
}
else alert("Internet Explorer 4.0 以降でブラウスしてください。");
posXY()はonmousemoveイベントで実行される関数です。
関数内部では、取得した座標値をタイトルバーに表示しています。
これで、マウスポインタが動くたびに、座標を取得し、タイトルバーに表示することを繰り返します。
また、document.body.style.cursorでマウスカーソルの形状をクロスヘアーラインに変更しています。
これがNetscapeで正常に動作しないのでInternet Explorer専用にしました。
このスクリプトを使用するには、次のようにbody領域内にスクリプトファイルを読み込む記述を1行追加するだけです。
head内に記述してもよさそうですが、bodyが形成される前に実行されるとdocument.bodyが認識できない・・・というエラーになります。
bodyタグ内にonLoadイベントでマウスカーソルの変更をしても良いでしょう。
<body>
・・・
<script language="javascript" src="mouse_xy.js"></script>
</body>
これだけでタイトルバーには、マウスポインタの座標がリアルタイムに表示されます。
ただし、座標を表示させようとするHTMLファイルと同じホルダにマウスポインタ座標表示スクリプトファイル(mouse_xy.js)があるものとします。
タスクバーのボタンにも座標が表示されますので見易い方を使ってください。
また、マウスカーソルはクロスヘアラインカーソルに変更されます。
カーソルの中心（ヘアラインが交差しているところ）が指している座標の値が表示されます。