隐藏所有内容，直到完全加载为止

Question

$(document).ready(function(){
setTimeout(function(){$('.preloader').fadeOut()}, 5000);
});

这一小段基本代码显示了一个加载图标，在文档加载时淡出。正如您在此处看到的http://www.intelligen.info，它在加载之前会慢慢显示内容。

如何更改上面的代码，以便在完全加载之前隐藏所有内容？

Answer 1

整个页面？

$(document).ready(function() {
    $('.preloader').fadeOut(300);
});

如果你想等待图像，那么，好吧......

$(document).ready(function() {

    var imageCount = $('img').length;
    $('img').load(function() {
        imageCount--;
        if (imageCount <= 0)
            $('.preloader').fadeOut(300);
    });

});

Answer 2

$(document).on('ready', function () {
  // this is run first, as soon as we can play with the DOM
  showLoadingScreen();
});

$(window).on('load', function () {
  // this is run after, once all the content has loaded (img etc)
  hideLoadingScreen();
});