javascript 弹出DIV以浏览器为参照垂直局中

来源：百度知道 编辑：UC知道 时间：2024/06/25 10:54:57
http://auction1.paipai.com/5D44152200000000005D377103B469BC
像拍拍网的产品大图展示，点击图片弹出DIV窗口显示大图。页面往下拖动一点，点击图片弹出的DIV窗口还是垂直局中。如何实现这个效果？

代码如下，你可以直接运行检测效果，随意更改IE大小，你只要点击“show”按钮，就能使div居中，应该就是你想要的效果~
<HTML>
<HEAD>
<TITLE> New Document </TITLE>

<script>
function show(){
var screenWidth = document.body.clientWidth+document.body.scrollLeft;
var screenHeight = document.body.clientHeight;

var divObj = document.getElementById("mydiv");
var divWidth = divObj.offsetWidth;
var divHeight = divObj.offsetHeight;

var left = parseInt((screenWidth - divWidth)/2);
var top = parseInt((screenHeight - divHeight)/2);
divObj.style.left = left+document.body.scrollLeft;
divObj.style.top = top+document.body.scrollTop;
}
</script>
</HEAD>

<BODY>
<input type="button" onclick="show()" value="show">
<div id="mydiv" style="border:1px solid #A2C5ED;position:absolute;display:block;background-color: