使用js预加载图像

Preloading images with js

本文关键字：图像 加载 js 使用      更新时间：2023-09-26

我使用这个教程在我的网站上制作图像滑动条。但我有100多张照片。当页面加载时，很难加载所有内容。那么，有什么技巧可以预加载前10张图像，当我要滑动到第9张时，加载另外10张吗?

或者有已经准备好的jquery插件提供这个?

使用jquery，就像这样简单:

$('<img />')[0].src = 'image.jpg';

会创建一个元素，但不会将其添加到页面中图像被加载，但从未显示检查firebug中的Net面板，查看它是否已加载。

使用jQuery，我这样做:

(function($) {
  var cache = [];
  $.preLoadImages = function() {
    var args_len = arguments.length;
    for (var i = args_len; i--;) {
      var cacheImage = document.createElement('img');
      cacheImage.src = arguments[i];
      cache.push(cacheImage);
    }
  }
})(jQuery)
jQuery.preLoadImages("/images/img01.jpg","/images/img02.jpg");
相关文章：