Envoking mouse capturing function onmousedown?
I have the following:
<html>
<script type="text/javascript">
document.onmousemove = getCursorXY;
function getCursorXY(e) {
document.getElementById('cursorX').value = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
document.getElementById('cursorY').value = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
}
</script>
<body>
<input id="cursorX" size="3">
<input id="cursorY" size="3">
<input type="button" id="button">
</body>
</html>
With this my mouse coordinates are displayed in the input fields when th开发者_C百科e page loads and whenever i move the mouse. How can i make this work only when i mousedown over #button and then stop at the last coordinates when i mouseup only over #button?
using firefox 3.6.3
Thanks in advance :)
Try something like this.
<html>
<script type="text/javascript">
function getCursorXY(e) {
document.getElementById('cursorX').value = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
document.getElementById('cursorY').value = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
}
window.onload = function () {
document.getElementById("button").onmousedown = getCursorXY;
}
</script>
<body>
<input id="cursorX" size="3">
<input id="cursorY" size="3">
<input type="button" id="button">
</body>
</html>
精彩评论