その他 |
◆その他◆
|
■■1■■
[概要]
マウスの座標を表示する
[参照]
[ソース]
<HTML>
<TITLE>マウスの座標</TITLE>
<SCRIPT language="JavaScript">
<!--
//X,Y座標初期化
var mouse_x = 0;
var mouse_y = 0;
function setPosi() {
//X,Y座標取得
mouse_x = event.clientX + document.body.scrollLeft;
mouse_y = event.clientY + document.body.scrollTop;
//画面から外れた時
if (mouse_x < 0){
mouse_x = 0;
}
if (mouse_y < 0){
mouse_y = 0;
}
//フォームに表示
document.myform.box_x.value = mouse_x;
document.myform.box_y.value = mouse_y;
}
//-->
</SCRIPT>
</HEAD>
<BODY onMouseMove="setPosi()">
<center>
<FORM name="myform">
<TABLE border=2 cellpadding=6>
<TR>
<TD colspan=2 bgcolor=blue align=center>
<FONT color=white><b>マウスの座標</b>
</TD>
</TR>
<TR>
<TD bgcolor=#ffffe8 align=center>
<b>X座標 <INPUT type="text" name="box_x" value="0" size="4">
</TD>
<TD bgcolor=#ffffe8 align=center>
<b>Y座標 <input type="text" name="box_y" value="0" size="4">
</TD>
</TR>
</TABLE>
</FORM>
</BODY>
</HTML>
※赤は変更点
※水色はid
※緑の部分はコメント部分。一緒に貼り付けても大丈夫。