Question

我为客户网站构建了一个视差滚动介绍 - 该网站包含许多高分辨率图像 - 所以我创建了一个快速加载器，用全屏高z-index div消隐屏幕，然后使用setTimeout方法在文档准备好后4秒钟淡入页面（不确定这是否是最好的方法，但它适用于我尝试过的每个测试）。

我想禁用滚动以阻止用户在动画显示之前滚动动画 - 是否有人建议使用良好的跨浏览器方法来执行此操作？

Answer 1

如果要在加载所有图像时淡入，可以试试这个

var images = $('img');
var images_nbr = images.length;

images.load(function() {
    images_nbr--;

    if (images_nbr == 0) {
        $('body').css('overflow','auto');
        $('...').fadeIn();
    }
});

Answer 2

集

#mydiv {
    overflow:hidden 
}

在CSS中的父div中。然后，在您的文档中添加此...

$('#mydiv').css('overflow', 'auto');

...在淡化内容的功能中。

因此，在加载时页面将不可滚动，但是当您淡入时，溢出属性将被覆盖并允许内容滚动。

Answer 3

.scrolldiv{
overflow:hidden;
}

$(window).load(function(){
   $(".scrolldiv").css("overflow","auto");
});

Answer 4

你可以试试，最初在身体上添加以下css

body {overflow:hidden;}

并在你的setInterval函数完成执行后（无论你的加载函数是什么）只需从正文中删除样式，如

$('body').css('overflow','auto');

禁用页面滚动直到页面加载 - JQuery

4 个答案: