デベロッパーツールにマウスカーソルの位置取得Javasscriptの埋め込み方
初めて質問させて頂きます。
ChromeなりFirefoxのデベロッパーツールを使って、任意の場所にマウスカーソルの現在座標を表示させようとしています。サイトを表示させてデベロッパーツールを開き、htmlの適当な位置に以下のようなエレメントを追加しました。
<div>
X:<input id="mouseX"></input>
Y:<input id="mouseY"></input>
</div>
上記は無事表示されています。ここで更にbodyタグ直下にscriptタグで以下のようなコードを挿入しました。
<script>
onload=function() {
fieldX=document.getElementById("mouseX");
fieldY=document.getElementById("mouseY");
document.onmousemove=function(evt){
if(document.all && !window.opera){
fieldX.value=window.event.clientX;
fieldY.value=window.event.clinetY;
}else{
fieldX.value=evt.pageX;
fieldY.value=evt.pageY;
}
};
}
</script>
なんとなくダメそうな気はしてましたがやはりだダメだったので、onload=function(){}を削除してみましたがダメでした。もっと時間を掛けてじっくり調べるか、一からJavaScriptの基本的な所をもっと深く理解すれば、基本的な所が解って無さそうな気はしてるのですが、自分の今の理解では少し時間が掛かりそうなので、こちらでもっと詳しい方のお知恵を拝借できればと思い質問させて頂きました。
どなたかお知恵をお貸し頂けたら嬉しいです。宜しくお願いします。