Javascript-форум - Узнать координаты курсора в элементе.

Вот собственно говоря скрипт определения и вывода координат курсора мыши относительно окна браузера мне бы хотелось его переделать.
Что бы он работал относительно элемента (изображения). То есть ноль х и у находились в левом верхнем углу не окна браузера, а элемента. Подскажите, очень надо заранее благодарю.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <title></title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script language="JavaScript" type="text/javascript">
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false

function init() {
    if (ns4) {document.captureEvents(Event.MOUSEMOVE);}
    document.onmousemove=mousemove;
}
function mousemove(event) {

        var mouse_x = y = 0;
    if (document.attachEvent != null) {
        mouse_x = window.event.clientX;
        mouse_y = window.event.clientY;
    } else if (!document.attachEvent && document.addEventListener) {
        mouse_x = event.clientX;
        mouse_y = event.clientY;
    }
    status="x = " + mouse_x + ", y = " + mouse_y;
    document.getElementById('xy').innerHTML = "x = " + mouse_x + ", y = " + mouse_y;
}
  init()
</script>


</head>

<body>

<span id="xy"></span> <br />
<img src="2.jpg"  border=0 />
</body>

</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script language="JavaScript" type="text/javascript"> ns4 = (document.layers)? true:false ie4 = (document.all)? true:false function init() { if (ns4) {document.captureEvents(Event.MOUSEMOVE);} document.onmousemove=mousemove; } function mousemove(event) { var mouse_x = y = 0; var i = document.getElementById('img'); if (document.attachEvent != null) { mouse_x = i.event.clientX; mouse_y = i.event.clientY; } else if (!document.attachEvent && document.addEventListener) { mouse_x = event.clientX; mouse_y = event.clientY; } status="x = " + mouse_x + ", y = " + mouse_y; document.getElementById('xy').innerHTML = "x = " + mouse_x + ", y = " + mouse_y; } init() </script> </head> <body> <span id="xy"></span> <br /> <img id="img" src="2.jpg" border=0 /> </body> </html>