javascript 怎样在页面下拉滚动条后,使弹出的层,始终居于屏幕的正中央

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<div style="position:absolute; z-index:1000; width:200px; height:200px; visibility:hidden; background:#00f;" id="ld"></div>
<br /><br /><br /><br /><br />
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="button" value="visible" onclick="vis('ld')" />
<div style="width:1200px"></div>
<br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<script>
function vis(elm){
var elm = document.getElementById(elm), bod = document.documentElement, left = (bod.clientWidth)/2+bod.scrollLeft-elm.offsetWidth/2 + 'px', top = (bod.clientHeight)/2 +  bod.scrollTop - elm.offsetHeight/2 + 'px';
elm.style.left = left;
elm.style.top = top;
elm.style.visibility = 'visible';
onscroll = onresize = function(){
var left = (bod.clientWidth)/2+bod.scrollLeft-elm.offsetWidth/2 + 'px', top = (bod.clientHeight)/2 +  bod.scrollTop - elm.offsetHeight/2 + 'px';
elm.style.left = left;
elm.style.top = top;
}
}
</script>
</body>
</html>