画像のDefferedとプリロードサンプル

by iwbjp

HTML

<div id="t">test</div>

JavaScript

function loadImg(){
  var images = [
    "http://iwb.jp/wp-content/uploads/2013/05/pocket_wifi_ssid.png"
  ];

  for(var i = 0; i<images.length; i++){
    $("<img>").attr("src", images[i]);
  }

  var preload = function(src){
    var d = $j.Deferred(); 
    var img = new Image;
    img.src= src;
    img.onload = d.resolve;
    img.onerror = d.reject;
    return d.promise();
  };

  var preload_images_paralell = function(srcs){
    var dfds = srcs.map(function(src){return preload(src);});
    return $j.when.apply($j, dfds);
  };
  console.log("done");
}
loadImg();

$("#t").click(function(){
  $(this).append('<img src="http://iwb.jp/wp-content/uploads/2013/05/pocket_wifi_ssid.png">');
});