Preload An Array Of Images With jQuery - preload.js

Just another jQuery image preload plugin which allows you to sequentially or randomly preload an array of large images before loading them into the DOM.

How to use it:

1. Put the jQuery preload plugin's script after jQuery JavaScript library as this:

<script src="//code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="js/preload.js"></script>

2. Preload an array of large images sequentially.

// $.preload(imgs, options);
var imgs = [];

for(var i = 0;i < 7;i++) {
  imgs[i] = "img" + (i + 1) + ".jpg";
}

$.preload(imgs);

3. Preload an array of large images randomly.

// $.preload(imgs, options);
var imgs = [];

for(var i = 0;i < 7;i++) {
  imgs[i] = "img" + (i + 1) + ".jpg";
}

$.preload(imgs,{
  ordered: false
});

4. Execute a callback function on each image loaded.

$.preload(imgs,{

  eachOnLoad: function(){
    // do something
  }

});

5. Execute a callback function when all the image have been completely loaded.

$.preload(imgs,{

  allOnLoad: function(){
    // do something
  }

});

---

This awesome jQuery plugin is developed by yangyile. For more Advanced Usages, please check the demo page or visit the official website.