JavaScript--マウスの位置.


<script type="text/javascript">
function mouseMove(ev){
  ev = ev || window.event;
  var mousePos = mouseCoords(ev);
  document.getElementById('xxx').value = mousePos.x;
  document.getElementById('yyy').value = mousePos.y;
}

function mouseCoords(ev){
  if(ev.pageX || ev.pageY){
    return {x:ev.pageX, y:ev.pageY};
  }
  return {
    x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
    y:ev.clientY + document.body.scrollTop - document.body.clientTop
  };
}

document.onmousemove = mouseMove;
</script>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
X:<input id="xxx" type="text" />  Y:<input id="yyy" type="text" />
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
 
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
 <style type="text/css" >
 #Div_CnLei {
 border:1px solid #ccc;
 background:#eee;
 line-height:200px;
 text-align:center;
 width:800px;
 height:200px;
 }
</style>
<div id="Div_CnLei"> </div>
<div id="PosXY">            !</div>
<script type="text/javascript">
var w3c=(document.getElementById)? true: false;
var agt=navigator.userAgent.toLowerCase();
var ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1) && (agt.indexOf("omniweb") == -1));

function IeTrueBody(){//           
	return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function getMousePos(e){
	var curX=(!ie)?e.pageX : event.clientX+IeTrueBody().scrollLeft;
	var curY=(!ie)?e.pageY : event.clientY+IeTrueBody().scrollTop;
	document.getElementById("PosXY").innerHTML = "        : X=" + curX + " ,Y=" + curY;
}

document.getElementById("Div_CnLei").onmousemove=getMousePos;
</script>