页面预加载程序加载到后期

Question

我使用通过以下jQuery代码段加载的自定义CSS预加载程序。

问题是，它加载在一起的JavaScript，所以它需要一段时间。结果是，在第一个2-3秒内，我的页面上没有任何内容 - 没有内容，也没有预加载器。

我试图将项目中的预加载器脚本先移到项目中，以便首先加载它，但这并没有多大帮助。

如何让它立即加载，没有滞后？

<!-- Preloader --> 
    <script type="text/javascript"> 
     //<![CDATA[ 
     $(window).load(function() { // makes sure the whole site is loaded 
       $('#status').load("preloader/preloader.html"); // will first fade out the loading animation 
       $('#preloader').delay(2500).fadeOut('slow'); // will fade out the white DIV that covers the website. 
       $('body').delay(2500).css({ 
        'overflow': 'visible' 
       }); 
      }) 
      //]]> 
    </script> 

preloader.html是我的css preloader的html代码。

Answer 1

你的滞后需要这么长时间的原因是因为你正在等待整个网站被加载。这通常由图像占用，因此用$(document).ready代替$(window).load可能会使其更快。另外请注意，您的延迟时间为2500毫秒（2.5秒），减少的话也会使其加载速度更快。

<!-- Preloader --> 
<script type="text/javascript"> 
    //<![CDATA[ 
    $(document).ready(function() { // makes sure the whole site is loaded 
     $('#status').load("preloader/preloader.html", function() { 
      //run after ajax get request completes (preloader.html is loaded) 
      //now we remove the delays since we have explicity waited for the preloader to load 
      $('#preloader').fadeOut('slow'); // will fade out the white DIV that covers the website. 
      $('body').css({ 
       'overflow': 'visible' 
      }); 
     }); 
    }); 
    //]]> 
</script>