日期:2014-05-17  浏览次数:20764 次

DIV 的绝对布局问题!
我用   javascript   延迟显示DIV   并屏幕居中显示

遇到问题:当网页有滚动条的时候,div就不能按着屏幕居中了。

也就是说把滚动条下拉一下DIV   就不屏幕居中了,

请问这个问题该怎么决绝?
达到效果是不管滚动条拉在什么位置DIV总能是居中显示出来的。


这是显示方法
function   openFlyBar(){
divFlyBar.style.visibility   =   "visible ";
divFlyBar.style.top=(document.body.clientHeight-divFlyBar.offsetHeight)/2+ "px ";
divFlyBar.style.left=(document.body.clientWidth-divFlyBar.offsetWidth)/2+ "px ";
}

<div   id= "divFlyBar "     style= "Z-INDEX:100;   VISIBILITY:hidden;POSITION:absolute "> 测试 </div>

延迟显示DIV
<script>
window.setTimeout( "openFlyBar() ",1500);
</script>

------解决方案--------------------
试一下这个:
divFlyBar.style.top=document.body.scrollTop+document.body.offsetHeight/2-divFlyBar.style.width/2
原理:网页滚去的高度+(网页可见区域高/2)-(DIV的高度/2)
------解决方案--------------------
divFlyBar.style.top=(document.body.scrollTop+document.body.clientHeight-divFlyBar.offsetHeight)/2+ "px ";