将图像预加载到浏览器缓存中

时间:2015-06-23 11:14:43

标签: javascript jquery

我正在尝试制作一个展示大量艺术品的图片库。因此,该网站将有很多图像。我注意到当我在另一台计算机上查看我的代码时,图像需要一些时间来加载。在我的电脑上,他们会立即显示,我猜这是因为他们已经被缓存了。

所以我做了一些环顾四周,看看能否防止这种情况,我发现有很多人提到预装图像。但是,我真的找不到符合我的愿望的解决方案或我能理解的解释(我讨厌使用我不理解的代码)。所以我试着自己动手并没有成功,但我觉得我写的是正确的逻辑,但需要调整我将在下面编写我的代码,并且有关下一步需要做什么的任何建议都是非常感谢。

预加载图片代码:

var allImages = $(img).attr('src'); //select every image
var preloadImages = [];

//add images to empty array
for(var i = 0; i < allImages.length; i++ )  {
 preloadImages.push(allImages[i]);
}

//then preload images
for(var i = 0; i < preloadImages.length; i++ )  {
 new Image().src = preloadImages[i];
}

这就是我写的代码,用于在我的页面上预加载图像。让我知道我哪里出错了。我真的不确定如何选择我网站上的所有图像并将它们加载到一个阵列中然后我可以循环一下?

感谢您的回复,我想我没有解释我的问题。许多预加载图像的解决方案似乎是手动在每个图像src和数组中键入。我正在寻找的是一种方法来选择我拥有的每一个图像,然后将它们放入一个数组而不实际输入它们。这可能吗?我的理由是,当我不断添加越来越多的图像时,如果预加载可以自己处理,那将是很好的。

0 个答案:

没有答案