1

我对 PreloadJS 在 Firefox 上的行为有疑问。实际上，我很难相信以前没有其他人遇到过这个问题（找不到任何描述相同行为的人）所以也许我只是做错了什么......它在谷歌浏览器中运行得很好。

这是JS部分：

$(document).ready(function () {
  var preloadBG = new createjs.LoadQueue();
   preloadBG.addEventListener("fileload", function(){
     $('#light').css("background-color","green");
     $("#container").append('<div id="image"></div>');
   });
   preloadBG.loadFile('http://i.imgur.com/ifvZ5Ss.jpg');
});

请参阅此处的示例：http: //codepen.io/Deto15/pen/KdpRdx

如果您使用 Firefox 和 Ctrl+F5 运行它，您会注意到我所描述的行为。

所以基本上我在这里做的是：

  1. 在 domready PreloadJS 上预加载图像（它实际上还没有在页面上的任何地方使用。
  2. 预加载完成后，红色圆圈变为绿色。
  3. 在该新 div 被附加到页面之后，该 div 使用之前预加载的图像作为背景图像。

它在 Chrome 中的行为方式是图像出现在与圆圈改变颜色几乎相同的时刻——这是有道理的，因为它已被预加载。在 Firefox through 上，圆圈改变颜色，然后在图像出现之前有一段延迟 - 就好像 Firefox 再次加载它一样。

对此行为有任何解释以及解决此问题的任何方法吗？

4

1 回答 1

0

Comparing the two in dev tools:

Firefox and Chrome comparison

From what I can see, Firefox is not retrieving the image from cache while Chrome does.

One possible solution could be related to the image size, as detailed here.

I'd suggest testing with smaller images first to see if that resolves the caching issue.

于 2015-09-09T03:11:21.853 回答