HTML覆盖高度覆盖整个可见页面

Question

我有一个网页,使用AJAX加载一些东西.我想在加载过程中显示带有加载指示符的叠加层,这样用户就无法与大部分页面进行交互 - 除了顶部的菜单.我正在使用jQuery和jQuery BlockUI插件来执行此操作.

我调用$(element).block()并且它工作正常,但覆盖只延伸到我页面的当前内容.随着更多内容被加载并添加到页面中,叠加层随之向下移动,这看起来有点难看.理想情况下,我希望它从一开始就覆盖整个页面的可见区域.这样做的一个简单方法就是为叠加设置一个较大的高度值,如下所示:

$(myElement).block({
        overlayCSS: {
            height: '10000px'
        }
 });

...但这会创建一个滚动条!如何避免这种情况并将其设置为覆盖可见页面的正确高度,但不能将其放大？

Answer 1

用position: fixed;而不是position: absolute.这样,即使滚动,叠加层也不会移动.

Answer 2

设置position为absolute100%，高度设置为 100%。