jQuery 整个 HTML 页面使用微调器加载

我正在尝试做一些简单的事情——制作一个 jQuery 脚本，它将等待显示整个页面，包括所有 DIV、文本和图像。当页面加载时，我不想显示页面的一部分，而是显示旋转的 GIF 图像，当整个页面加载时，我们可以在浏览器窗口中淡入淡出页面内容。

有很多脚本可以通过 ajax 请求加载到容器 DIV 中 —— 但这是不同的。这将在加载 HTML 页面时显示旋转的 GIF。任何帮助表示赞赏

这种类型的脚本仅适用于ajax请求

$('#loadingDiv')
    .hide()  // hide it initially
    .ajaxStart(function() {
        $(this).show();
    })
    .ajaxStop(function() {
        $(this).hide();
    });

$(document).ready(...)DOM 加载后立即触发。这还太早了。你应该使用$(window).on('load', ...):

JavaScript：

$(window).on('load', function(){
    $('#cover').fadeOut(1000);
})

CSS:

#cover {
    background: url("to/your/ajaxloader.gif") no-repeat scroll center center #FFF;
    position: absolute;
    height: 100%;
    width: 100%;
}

HTML:

<div id="cover"></div>
<!-- rest of the page... -->

看看这个 jsFiddle：http://jsfiddle.net/gK9wH/9/ http://jsfiddle.net/gK9wH/9/