Saturday, June 16, 2012

Detecting mouse positions through JavaScript



<script type="text/javascript">
document.onmousemove=f1;
document.onmousedown=f2;
document.onmouseup=f3;
function f1(event)
{
  var mouseX = event.clientX + document.body.scrollLeft;
      var mouseY = event.clientY + document.body.scrollTop;
document.getElementById("currentx").value=mouseX;
document.getElementById("currenty").value=mouseY;
}


function f2(event)
{
  var mouseX = event.clientX + document.body.scrollLeft;
      var mouseY = event.clientY + document.body.scrollTop;
document.getElementById("downx").value=mouseX;
document.getElementById("downy").value=mouseY;
}


function f3(event)
{
  var mouseX = event.clientX + document.body.scrollLeft;
      var mouseY = event.clientY + document.body.scrollTop;
document.getElementById("upx").value=mouseX;
document.getElementById("upy").value=mouseY;
}
</script>
<table width="100%" border="2">
<tr><td colspan="4" align="center">Mouse Data</td></tr>
<tr><td>Current Mouse X</td><td>
<input type="text" id="currentx"/>
</td><td>Current Mouse Y</td><td>
<input type="text" id="currenty"/>
</td></tr>



<tr><td>Down Mouse X</td><td>
<input type="text" id="downx"/>
</td><td>Down Mouse Y</td><td>
<input type="text" id="downy"/>
</td></tr>



<tr><td>Up Mouse X</td><td>
<input type="text" id="upx"/>
</td><td>Up Mouse Y</td><td>
<input type="text" id="upy"/>
</td></tr>
</table>



No comments:

Post a Comment