Jquery 简单图像加载器

我有一个简单的“加载”场景，其中包含两幅图像：

$('.img-loading').show();
// main image loaded ?
$('.the-big-img').hide().load(function () {
    // hide/remove the loading image
    $('.img-loading').hide();
    $('.the-big-img').fadeIn();
});

然而。。。这似乎只在大多数时候起作用。有几次我只剩下加载图像而没有显示大的img。我不确定在哪些情况下图像不会显示（它们都存储在我的本地主机上，并且满足相同的条件）

如果我在大img没有加载的页面上点击F5/刷新，它们将第二次加载

有什么想法吗

更新：

---

在这里找到了一些关于缓存的信息：

如果你发现的不起作用，我也会给你一些其他的解决方案

---

在Apache中禁用ETag： 这会告诉浏览器每次加载文件的新版本，从而消除缓存问题

Header unset ETag
FileETag None

将图像保持器动画放置在挂起图像的位置，直到加载：

---

您能否在live页面上提供此链接？如果没有，请尝试在图像上使用内联CSS，以了解您希望图像如何开始，然后将

img加载设置为隐藏（）+
大img
设置为加载（）中的fadeIn（）。此外，为它们提供相同的类，并使用
id=“img-load”
等进行特殊性。然后你可以调用
$（'.all images to load'）.load（）
并在它们都完成时加载。加载图像和运行这样的操作不是很准确，因为浏览器可以缓存图像，然后
.load（）
函数不会运行，因为浏览器从不请求它。这就是为什么在刷新（刷新刷新缓存以获得新图像）之前，您不会看到其他图像的原因。是的，我认为缓存一定是问题所在。所以解决办法是什么（好的，我在这里找到了一个相关的话题：是的，我得到了加载img的部分。另一方面，我不知道每次加载同一个图像的不同版本只是为了“加载效果”而消除缓存有多舒服。