マウスの座標を取得する　client　screen

clientX（ブラウザX軸） : -
clientY（ブラウザY軸） : -
screenX（スクリーンX軸） : -
screenY（スクリーンY軸） : -

[ソースコード]

<script type="text/JavaScript">
window.addEventListener("load" , Start);

function Start(){
	document.addEventListener("mousemove" , mouseReport); // documentにmousemoveイベントを発生させている。
}

function mouseReport(evt){
	var client_x = document.getElementById('clientX');
	var htmlX = evt.clientX; // evtはdocumentを指している。
	client_x.firstChild.nodeValue = htmlX;
	
	var client_y = document.getElementById('clientY');
	var htmlY = evt.clientY;
	client_y.firstChild.nodeValue = htmlY;
	
	var screen_x = document.getElementById('screenX');
	var screenX = evt.screenX;
	screen_x.firstChild.nodeValue = screenX;
	
	var screen_y = document.getElementById('screenY');
	var screenY = evt.screenY;
	screen_y.firstChild.nodeValue = screenY;
}
</script>

インデックスにもどる