Div popup goes out of place as browser window scrolled

[sydsyd]

Hi,
I'm using below code to create popup when mouseovered on anchor items in a table.when the browser window is scrolled, the popup goes out of place, Anchor10 popup displays at anchor8 link position.



<style type="text/css">
.boxpopup {
z-index:100;
/* font-family:Arial,sans-serif; TEXT FONT*/
/* font-size:90%; TEXT SIZE*/
color:black; background:#FFFFFF; /*COLOURS*/
width:auto; /*BOX WIDTH*/
text-align:center; /*ALIGNMENT*/
padding:4px 5px 4px 5px; /*SPACING*/
font-weight:bold; /*BOLD TEXT*/
border:1px solid gray; /*BORDER STYLE*/
}
#pdqbox {position:absolute; visibility:hidden; z-index:800;}

</style>


<div id="pdqbox"></div>
<script TYPE="text/javascript">
OffsetX=20;
OffsetY=-20;
var skn,yyy=-1000;
skn=document.getElementById("pdqbox").style;
skn.visibility="visible";
skn.display="none";

document.onmousemove=get_mouse;
function popup(msg){

var content="<div class=boxpopup>"+msg+"</div>";
yyy=OffsetY;
document.getElementById("pdqbox").innerHTML=content;
skn.display='';
}

function get_mouse(e){

var x=event.x+document.body.scrollLeft;
skn.left=x+OffsetX;

var y=event.y+document.body.scrollTop;
skn.top=y+yyy;

}

function remove_popup(){
//yyy=-1000;
skn.display="none";
}
</script>

i'm calling the popup funciton using the anchor onmouseover event.
<a href="/"; alt=""; onMouseOver="popup('')" ></a>

Any help would be highly appreciated.

Regards,
Sid