0

我正在尝试找到一个可以很好地与 Marcofolio 幻灯片配合使用的 jQuery 图像预加载器（此处为http://www.marcofolio.net/webdesign/advanced_jquery_background_image_slideshow.html）。

费城网站上也使用了相同的幻灯片：http: //www.visitphilly.com/ - 但是当我使用我的网络开发人员工具查看工作中的 javascript 时，我很难弄清楚到底在哪里预加载器正在被调用。

我也尝试使用以下预加载代码，但它似乎对这种情况没有帮助（似乎在 Safari 浏览器中加载速度最慢）：

function preload(arrayOfImages) {
    $(arrayOfImages).each(function(){
    });
  }

  preload([
   'images/image1.jpg',
   'images/image2.jpg',
   'images/image3.jpg',
   'images/image4.jpg',
  ]);

如果聪明的人可以检查 visitphilly 网站元素，他们可能会看到我在这里明显遗漏的内容。或者，将不胜感激预加载插件建议，因为我尝试了一些似乎对这个特定幻灯片没有帮助的方法。

谢谢！

4

3 回答 3

4

你不需要 jQuery：

var images = [
    'a.png',
    'b.png'//etc
];

var path = 'images/';
var i, image, img;
for(i = 0; image = images[i]; i++) {
    img = new Image();
    img.src = path + image;
}
于 2010-09-21T16:40:58.323 回答
0

尝试以正确的顺序预加载图像。

function preload(arrayOfImages) {
    var i = 0;

    function preloadnext() {
        if (i < arrayOfImages.length) {
            var img = new Image();
            img.onload = preloadnext;
            img.src = arrayOfImages[++i];
        }
    }

    preloadnext();
}

您还可以指定图像大小（'new Image(width, height)'），但我不确定它是否有帮助。

于 2010-09-21T17:25:32.713 回答
0

我一直使用这个很棒的插件： http: //flesler.blogspot.com/2008/01/jquerypreload.html

$.preload([ 'red', 'blue', 'yellow' ], {
    base:'images/colors/',
    ext:'.jpg'
});

除了它编码良好的事实之外 - 预加载图像存在问题，即这个插件处理。

于 2011-08-04T09:21:12.553 回答