JavaScriptでマウス座標を取得するにはonmousemoveイベントハンドラで、イベントオブジェクトのclientXとclientYを読めば良い。以下はマウス座標を表示するHTMLの例である。わずか7行のJavaScriptで実装が可能だ。
<html>
<head>
<script type="text/javascript">
(function() {
window.onmousemove = handleMouseMove;
function handleMouseMove(event) {
event = event || window.event; // IE対応
document.body.innerHTML = event.clientX + ", " + event.clientY;
}
})();
</script>
</head>
<body>
</body>
</html>
Internet Explorerではイベントハンドラにイベントオブジェクトが渡されないため、上記のコードではeventがnullならwindow.eventでイベントオブジェクトを上書きするようになっている。||演算子を使えば条件分岐は必要ない。
