0

我的页面中有一个 div 样式:

top: 0;
bottom: 0;
left: 0;
right: 0;
position: absolute; 

div 在页面上延伸并完全覆盖它。

当我在我的页面上打开一些对话框时,情况发生了变化。对话框也是绝对定位的,但它的高度可以大于页面的初始高度。这会导致出现滚动条。但是拉伸的 div 不再拉伸了!它的高度保持不变。

换句话说,由于出现新的大块而增加了javascript页面的可滚动区域并不会导致top:0和bottom:0元素的高度增加。

我该如何解决?

4

2 回答 2

1

div 总是使用最近的祖先的高度与position:relativeor position:absolute。如果您没有设置任何其他内容,这很可能是 html-Element。而这个通常不会仅仅因为它的内容调整大小而调整大小(如果你向下滚动并用萤火虫突出显示 html 元素,你可以看到这一点)。您可以尝试将 body 设置为position:relative

于 2013-01-24T10:08:39.607 回答
0
<body style=" background-color:red; opacity:0.7;">
<div id="new" style="background-color:yellow; z-index:100; width:200px; height:100px;">
</div>
</body>

这里的主体将充当您的绝对 div,您可以使用以下 javascript 代码对其进行测试:

<script type="text/javascript">
var num=100;
setInterval(function(){

document.getElementById("new").style.height= num+"px";
num=num+500;
},500);
</script>

请注意,当 div 的高度增加时,body 也会继续扩展。

于 2013-01-24T10:27:56.580 回答