Image 初始渲染后下载大型隐藏图像

我的网站显示缩略图。当用户单击图像时，图像将以较大的尺寸显示。图像本身有两种大小，用于快速渲染的缩略图大小和较大的大小

最初下载并显示缩略图大小。我想要的是在页面呈现/加载后下载（但隐藏）较大的图像。这样，初始渲染速度很快，但当用户单击缩略图时，图像已经下载

起初，我是通过

<div name = "big_path" style= "display:hidden" src == "" path = "big/path"></div>

在js/jquery中，加载后，我将src属性设置为path，从而下载图像。我不使用这个div元素做任何事情，除了下载图像

这在IE中有效，但Chrome不下载隐藏图像。因此，当用户单击缩略图时，首先下载图像。也许这已经足够快了，但我更希望已经下载了图像

---

该怎么做？

我最后做的是让div可见，但是让它以1px乘以1px的方式显示。然后我做了一个跨度，而不是div：

<span name = "big_path" style = "width:1px; height:1px" src == "" path = "big/path"></span>

---

一旦初始渲染完成，我仍然会设置src=path。

您可能需要执行以下操作：

$(document).ready(function(){
    //load images
    //append images
});

$('.thumbnail').append('<img src="img/lol.jpeg" />');

基本上，您是在加载文档后加载大型图像。之后，您将像这样附加图像：

$(document).ready(function(){
    //load images
    //append images
});

$('.thumbnail').append('<img src="img/lol.jpeg" />');

$（'.thumbnail'）。追加（''）；

你可能想把它放在一个for循环中，以获得大量的缩略图

---

另一个解决方案是使用。

我会查看渐进式图像，谢谢。也许我的问题不清楚，但我需要知道的是如何加载图像，同时让它们保持不可见/隐藏。但我找到了答案，请看其他答案。可能不是解决这个问题的最具语义的方法，但它很有效……很好：）