Coordinate mouse non rispettate per zoom

[Kreatore]

Ciao ragazzi.
Lo script seguente l'ho recuperato da un post del forum, che ora non trovo più.
L'ho adattato e il risultato ottenuto mi soddisfa. In pratica creo un effetto zoom su un'immagine, sfruttandone una copia.
Il mio problema, è che se scrollo la pagina, le coordinare reuperate vengono sballate.
Questo è lo script

<script language="JavaScript" type="text/javascript">
<!--
function display(boh,evOb){
var element;
//recupero le variabili dal layer1
tmpX=evOb.clientX - findPosX(boh) - 1;
tmpY=evOb.clientY - findPosY(boh) - 1;
//le visualizzo sul form
document.Show.MouseX.value=tmpX;
document.Show.MouseY.value=tmpY;
//ora le duplico per rapportarle all'immagine più grande
ztmpX=(tmpX*2);
ztmpY=(tmpY*2);
//in base alla loro posizione faccio muovere il layer2
if(tmpX<250){
document.getElementById('zoom').style.left="-"+ztmpX+'px';}
if(tmpY<250){
document.getElementById('zoom').style.top="-"+ztmpY+'px';}
}

//questedue funzioni sono state prese e copiate.
function findPosX(obj){
var curleft=0;
if(document.getElementById || document.all){
 while (obj.offsetParent){
  curleft += obj.offsetLeft;
	obj = obj.offsetParent;
  }
 }
else if (document.layers){
 curleft += obj.x;
 }
 return curleft;
}
function findPosY(obj){
var curtop=0;
if(document.getElementById || document.all){
 while (obj.offsetParent){
  curtop += obj.offsetTop;
	obj = obj.offsetParent;
  }
 }
else if (document.layers){
 curtop += obj.y;
 }
 return curtop;
}

//-->
</script>

questo invece è la parte in html

<div id="layer1" onmousemove="display(this,event);" >[img]foto.jpg[/img]</div>
<div id="layer2"><div id="zoom">[img]foto.jpg[/img]</div></div>

<form action= "" name="Show" class="show">
<input type= "text" name= "MouseX" value= "0" /> X 

<input type= "text" name= "MouseY" value= "0" /> Y 

<input type= "text" name= "MouseXX" value= "0" /> XX 

<input type= "text" name= "MouseYY" value= "0" /> YY 

</form>

tutto funziona finchè non devo scrollare la pagina.
Se volete provarlo, inserite una foto di 600x600px,
e con i css, assegnate questi valori:

#layer1{
width:300px;
height:300px;
background:#cc6600;
}
#layer1 img {
width:300px;
height:300px;
}
#layer2{
position:relative;
background:#00ff99;
width:100px;
height:100px;
overflow:hidden;
}
#zoom{
position:absolute;
margin:0px;
padding:0px;
}

sapete dirmi qualcosa?
Grazie

[Kreatore]

up!

nessun aiuto?