读书人

DIV 的绝对布局有关问题

发布时间: 2012-02-26 20:19:44 作者: rapoo

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)-—IV的高度/2)
[解决办法]
divFlyBar.style.top=(document.body.scrollTop+document.body.clientHeight-divFlyBar.offsetHeight)/2+ "px ";

读书人网 >CSS

热点推荐