Javascript 如何使用jquery检查是否下载了所有图像？

我正在我的应用程序中创建一个简单的图像动画。文档中有多个图像。我想，当页面加载的图像应该开始动画。我试过这个：

$(document).ready(function(){

 $(".slide").animate({
    left:'250px',
    opacity:'0.3',
  });

});

在我的本地服务器上，我得到了想要的效果，因为所有图像都会立即加载，但当我在托管服务器上运行相同的代码时，我并没有得到想要的效果。序列中第一个加载的图像开始设置动画，而其他图像在加载时设置动画

---

我希望所有图像都以并行方式而不是串行方式设置动画。有谁能告诉我如何确保加载图像，以便我可以为所有图像设置动画？

如果您的所有图像都在文档的HTML中（没有动态创建的图像），那么您只需切换到使用

$（窗口）。load（）

在页面中的所有图像完成加载之前不会触发：

$(window).load(function(){

 $(".slide").animate({
    left:'250px',
    opacity:'0.3',
  });

});

只需将

$（document）.ready（）

函数更改为

$（窗口）。将
函数加载为：

$(window).load(function() {

     $(".slide").animate({
        left:'250px',
        opacity:'0.3',
      });
});

这样做的原因是，当DOM元素准备好进行操作时，无论是否下载了其中的内容（如图像、视频等），都会触发
ready
事件，而当下载了DOM元素中的所有内容时，也会触发
load
事件
 确切地说，
dom就绪
状态意味着所有基本内容都已加载，页面已准备好与之交互。图像继续加载到背景中

您需要的是
窗口。onload
事件：

$( window ).load(function() {

 $(".slide").animate({
    left:'250px',
    opacity:'0.3',
  });

});

可能重复的