页面位置绝对中心-优快云博客


<!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-Language" content="en-us" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>DivCenter Experiment</title>
</head> 
<style>
body, html
{
 width: 100%;
 height: 100%;
 margin: 0px; 
 padding: 0px;
 background-color: #FFFFFF;
} 
.favBgStyle
{
 border: 0px;
 padding: 0px;
 margin: 0px;
 width: 100%;
 position: absolute;
 background-color: #000000;
 opacity: 0.5;
 filter: Alpha(opacity:50);
 z-index: 0;
} 
.favAreaBg
{
 border: 0px;
 padding: 0px;
 position: absolute;
 background-color: #FFFFFF;
 z-index: 1;
} 
.occupySpace
{
 height: 1500px;
}
</style> 
<script>
function OffWindowH()
{
 var OffWindowH=0; 
 window.scrollTo(0,10000000); 
 if(typeof self.pageYOffset!='undefined')
 OffWindowH=self.pageYOffset;
 else if(document.compatMode && document.compatMode != 'BackCompat')
OffWindowH=document.documentElement.scrollTop;
 else if(document.body && typeof(document.body.scrollTop)!='undefined')
OffWindowH=document.body.scrollTop;
 window.scrollTo(0,0); 
 return OffWindowH;
} 
function WindowHeight() 
{
  var WindowHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) 
  WindowHeight = window.innerHeight;
  else if (document.documentElement &&  document.documentElement.clientHeight) 
  WindowHeight = document.documentElement.clientHeight;
  else if(document.body && document.body.clientHeight) 
  WindowHeight = document.body.clientHeight; 
  return WindowHeight;
} 
function pHeight()
{
  var pHeight = OffWindowH() + WindowHeight();
  return pHeight;
} 
function favBg()
{
  var favBg = document.getElementById('favBg');
  favBg.style.height = pHeight() + 'px';
}
var cdiv = "blank";
function favArea() {
  if (cdiv == "blank") { cdiv = window.setInterval("favArea()", 50); }
 var Element = document.getElementById("favArea");
 objh = parseFloat(Element.style.height)/2;
 objw = parseFloat(Element.style.width)/2;
 Element.style.top = Math.floor(Math.round((document.documentElement.offsetHeight/2)+document.documentElement.scrollTop)-objh)+'px';
 Element.style.left = Math.floor(Math.round((document.documentElement.offsetWidth/2)+document.documentElement.scrollLeft)-objw)+'px';
}
</script> 
<body onload="favBg(); favArea();">
<div id="favArea" class="favAreaBg"  style="width: 500px; height: 400px;"><table width="100%" height="100%"><tr><td valign="middle" align="center">This is dead center</td></tr></table></div>
<div id="favBg" class="favBgStyle"></div>
<div class="occupySpace"></div>
</body>
</html>