我知道已经有几个类似的问题,但我认为我的情况有点不同。我有一个div,我使用绝对定位和浮动在页面上方,并设置了一个灰色的遮罩层覆盖其余部分。我已经让它正常工作,但当您上下滚动页面时,就会出现问题。
问题在于,当div出现时,它仍在使用ajax数据进行填充。因此,背景覆盖层的高度和宽度已经设置好了,但是一旦所有数据加载到浮动的div中,它有时会将页面向下推,从而增加高度。因此,我无法计算窗口或文档的高度和宽度,因为浮动的div可能尚未完全加载,一旦加载完成,它会进一步向下推屏幕,导致背景覆盖层无法覆盖整个页面。
例如,在代码中,它大致如下:
我通过添加一个警告来验证这一点,因此当我点击警告时,背景叠加层可以计算出真实的页面大小,并且看起来很好。 如果这听起来让人困惑,那我很抱歉,但希望你能理解我试图实现什么。我认为这不太难,但我还没有找到解决办法。 任何帮助都将不胜感激,我正在使用jquery。
问题在于,当div出现时,它仍在使用ajax数据进行填充。因此,背景覆盖层的高度和宽度已经设置好了,但是一旦所有数据加载到浮动的div中,它有时会将页面向下推,从而增加高度。因此,我无法计算窗口或文档的高度和宽度,因为浮动的div可能尚未完全加载,一旦加载完成,它会进一步向下推屏幕,导致背景覆盖层无法覆盖整个页面。
例如,在代码中,它大致如下:
loadBoxContent = function(){
..DO AJAX HERE..
..PUT CONTENT INTO FLOATING DIV..
$('#floatDiv').show()
$('#darkOverlay').height($(window).height());
}
我通过添加一个警告来验证这一点,因此当我点击警告时,背景叠加层可以计算出真实的页面大小,并且看起来很好。 如果这听起来让人困惑,那我很抱歉,但希望你能理解我试图实现什么。我认为这不太难,但我还没有找到解决办法。 任何帮助都将不胜感激,我正在使用jquery。
谢谢
fixed
定位是相对于视口而不是页面的,因此当您开始滚动时,整个视口仍然被覆盖。 - jeroen