预加载jQuery插件的CSS背景图片

我有一个使用针规的jQuery插件。在最初加载包含插件的页面时，插件在加载背景图像之前开始动画。当速度表超出范围时，第二张图像（“破损”仪表）会加载，但在图像加载之前会再次出现延迟。 （要看到这一点，输入一个低于零或高于100的值） http://jacob-king.com/demo/speedometer 我尝试使用这个解决方案，它解决了“破碎”图像预加载的问题： http://jacob-king.com/public/notSoPublic/jquery.speedometer-1.0.3/example.html

(function(){

     // counter
     var i = 0;

     // create object
     imageObj = new Image();

     // set image list
     images = new Array();
     images[0]=_speedometerDirectory+"/background.jpg";
     images[1]=_speedometerDirectory+"/background-broken.jpg";

     // start preloading
     for(i=0; i<=1; i++) 
     {
          imageObj.src=images[i];
     }

})();

但是如何在开始动画之前强制插件等待加载两个背景图像？ 解 由于图像是作为jQuery插件的一部分加载的，因此将它们放在$ .fn调用之外似乎不合适;除非调用速度表功能，否则不应加载图像。 我最终使用了crimson_penguin解决方案的略微修改版本：

var img0 = new Image();
img0.src = _speedometerDirectory+"/background.jpg";
var img1 = new Image();
img1.src = _speedometerDirectory+"/background-broken.jpg";

$(img0).load(function() {
    $(img1).load(function() {
        // Everything's ready. Now we begin.
    });
});

这可能看起来有些笨拙。随意提出一个更优雅的语法（它已经很晚了，我累了，这很有效，所以“足够好”）。结果可以在这里看到，我将把它作为我的1.0.4更新的一部分。感谢大家。 编辑：我说得太早了。如果没有将图像加载到缓存中，则插件无法在Google Chrome中的第一页加载时启动...