Javascript预加载器不等待图像

Question

我发现这个Javascript来激活我的website预加载器。但是，一旦页面加载，它似乎消失，而不是在图像加载完毕后消失。

搜索后我发现有人建议使用window.onload，等待图像加载，但我似乎无法弄清楚如何将其实现到现有的Javascript中。

$(document).ready(function(){
        $(".se-pre-con").fadeOut("slow")

Answer 1

如果您想使用window.onload功能隐藏预加载器，可以使用以下代码段附加到jQuery中的事件：

$(window).on('load', function () {
    $(".se-pre-con").fadeOut("slow");
}):

确保使用.on()方法签名，而不是事件签名.load()，它在jQuery 1.8中已弃用并在jQuery 3.0中删除。

您应该从.load()文档中注意以下内容：

  

与图片一起使用时加载事件的注意事项

     

开发人员尝试使用.load（）快捷方式解决的常见挑战是在图像（或图像集合）完全加载时执行函数。应该注意有几个已知的警告。这些是：

     

  
• 它不能始终如一地工作，也不能可靠地跨浏览器
  
• 如果图像src设置为与之前相同的src，它在WebKit中无法正确触发
  
• 它没有正确地冒泡DOM树
  
• 可以停止触发已存在于浏览器缓存中的图像