图片放大缩小的话，怎么让图片上面的坐标也随之变化呢

<div style="position:absolute; left:144px; top:164px;"><img border="0" src="hongD.gif"></div>
<!-- 如何让这个坐标的left 和top 都随着变化呢，否则会造成坐标不准 -->
<body>
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
    <tr>
    <td valign=top>   <img  id="oImg" src= "PYZDT2.jpg" width=400 border="0"  style="zoom: 100%;"></td>
  </tr>
</table>
<button onmousedown="chgSize(true);" onmouseup="window.clearTimeout(oTime);">放大</button>&nbsp;
<button onmousedown="chgSize(false);" onmouseup="window.clearTimeout(oTime);">缩小</button></body>
<script language="javascript">
    var oTime;
    function chgSize(args) {
        var oImg = document.all['oImg'];
        oImg.style.zoom = parseInt(oImg.style.zoom) + (args ? +10 : -10)  + '%';
        oTime = window.setTimeout('chgSize(' + args + ')', 100);
    }    
document.onmouseup = function() {
window.clearTimeout(oTime);
}  
</script>
<SCRIPT LANGUAGE=javascript FOR=document EVENT=onclick>
<!--
 //document_onclick()
//-->
</SCRIPT>