Javascript上延迟函数的替换

我在我的页面上制作了一个加载屏幕，它将覆盖整个屏幕大约10秒钟，然后它就会消失在应该在这10秒钟内加载的主要内容中

它可以工作，但问题是

delay

功能会在加载屏幕上显示10秒，并且在这段时间内主要内容不会预加载。我只是淡入内容，然后开始加载

如何更改功能，使其在10秒的持续时间内加载页面上的主要内容，而不只是显示加载屏幕

    <script src=‘http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script>
    $(function() {
        $('<div style="height:100%;width:100%;z-index:1000;background-color:blue;position:absolute;”><br><br><br><center><img src="http://bithumor.co/bh-logo.png" height="100" width="100"></center></div>')
        .insertBefore('body')
        .delay(6000)
        .fadeOut(function() {
          $(this).remove(); 
        });
    });
    </script>

---

使用超时来异步延迟脚本的一部分和脚本的其余部分

$(function() {
    var loading = $('<div style="height:100%;width:100%;z-index:1000;background-color:blue;position:absolute;”><br><br><br><center><img src="http://bithumor.co/bh-logo.png" height="100" width="100"></center></div>');
    loading.insertBefore('body');
    window.setTimeout(function(){
        loading.fadeOut(function() {
            $(this).remove(); 
        });
    },10000); // 10000 milliseconds = 10 seconds
});

$（函数（）{
var load=$（'使用超时来异步延迟脚本的一部分和脚本的其余部分

$(function() {
    var loading = $('<div style="height:100%;width:100%;z-index:1000;background-color:blue;position:absolute;”><br><br><br><center><img src="http://bithumor.co/bh-logo.png" height="100" width="100"></center></div>');
    loading.insertBefore('body');
    window.setTimeout(function(){
        loading.fadeOut(function() {
            $(this).remove(); 
        });
    },10000); // 10000 milliseconds = 10 seconds
});

$（函数（）{
变量加载=$（‘我很困惑，这个动画不是在加载文档后播放的吗？你所说的预加载到底是什么意思？动画在淡入页面主要内容之前播放10秒我很困惑，这个动画不是在加载文档后播放的吗？你所说的预加载到底是什么意思？动画在淡入页面之前播放10秒页面的主要内容