更改bg图像的jQuery循环正在再次请求已经加载的图像

Question

我有一个网站的部分用jquery改变它的bg图像。 我在循环中定位css

image.fadeOut(800, function () {
    image.css('background-image', 'url(img/' + images [i++] +')');
    image.fadeIn(800);
});
    if(i == images.length)
    i = 0;

我转到Chrome的开发工具，看到它正在请求bg图像，即使它们已经显示过。

从“大小内容”列中显示＆＃34;（来自缓存）＆＃34;。

这会不会影响页面上的性能？ 或者只是调用已加载的图像？

Answer 1

我很好奇并且更多地研究了这个问题，并且能够重现浏览器会对图像发出n次请求的问题（尽管如你所注意到的那样 - 它不一致......有时候它只会发出4个请求，有时会发出12个请求并停止......其他时候它会继续... ...

展望pre-loading，我发现如果你预先加载了一个图像对象并引用它，那么浏览器就不会发出其他请求。

这是一个小提示，展示：http://fiddle.jshell.net/6V4Dw/1/show/

谢谢！