var image = new Image();
    image.addEventListener("load", imageLoaded, false);
    image.src = url;

当image的src被设置后，就会自动去加载，当加载完成后可以给一个加调来统计是否加载完成所有的图片。

var images = document.images;
var total = images.length;
var loaded = 0;
for (var i = 0; i < total; i++) {
    var image = new Image();
    image.onload = function() {
        if (++loaded >= total) {
            // 图片已全部预加载完成
        }
    };
    image.src = images[i].src;
}

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(imgUrl); 

页面先显示加载的loading图片，然后你获取你要加载的图片是否都加载完毕，再用onload将loading图片隐藏掉就可以