JavaScript Mouse Events Code Library

<html>
<head>
<title>mouse events</title>

<script type="text/javascript">
function init()
         {
         document.onmousedown = mouseDown;
         document.onmousemove = mouseMove;
         document.onmouseup = mouseUp;
         if(navigator.appName == 'Netscape')
            document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
         }

function mouseMove(e)
         {
         var x = (navigator.appName == 'Netscape')? e.pageX : event.x+document.body.scrollLeft;
         var y = (navigator.appName == 'Netscape')? e.pageY : event.y+document.body.scrollTop;
         if(navigator.appName == 'Netscape' && e.target!=document)
            routeEvent(e);

         document.events.mouseMove_x.value = x;
         document.events.mouseMove_y.value = y;

         return(true);
         }

function mouseDown(e)
         {
         var x = (navigator.appName == 'Netscape')? e.pageX : event.x+document.body.scrollLeft;
         var y = (navigator.appName == 'Netscape')? e.pageY : event.y+document.body.scrollTop;
         if(navigator.appName == 'Netscape' && e.target!=document)
            routeEvent(e);

         document.events.mouseDown_x.value = x;
         document.events.mouseDown_y.value = y;

         return(true);
         }

function mouseUp(e)
         {
         var x = (navigator.appName == 'Netscape')? e.pageX : event.x+document.body.scrollLeft;
         var y = (navigator.appName == 'Netscape')? e.pageY : event.y+document.body.scrollTop;
         if(navigator.appName == 'Netscape' && e.target!=document)
            routeEvent(e);

         document.events.mouseUp_x.value = x;
         document.events.mouseUp_y.value = y;

         return(true);
         }
</script>
</head>

<body onload="init();">
<form name="events">
<table>
<tr>
<td><b>mouseMove</b></td>
<td>x:</td>
<td><input type="text" size="3" readonly name="mouseMove_x" /></td>
<td>y:</td>
<td><input type="text" size="3" readonly name="mouseMove_y" /></td>
</tr>

<tr>
<td><b>mouseDown</b></td>
<td>x:</td>
<td><input type="text" size="3" readonly name="mouseDown_x" /></td>
<td>y:</td>
<td><input type="text" size="3" readonly name="mouseDown_y" /></td>
</tr>

<tr>
<td><b>mouseUp</b></td>
<td>x:</td>
<td><input type="text" size="3" readonly name="mouseUp_x" /></td>
<td>y:</td>
<td><input type="text" size="3" readonly name="mouseUp_y" /></td>
</tr>
</table>
</form>
</body>
</html>