Skip to content

Instantly share code, notes, and snippets.

@derdesign
Last active December 17, 2015 09:39
Show Gist options
  • Save derdesign/5588986 to your computer and use it in GitHub Desktop.
Save derdesign/5588986 to your computer and use it in GitHub Desktop.
jQuery Image Preloader script + Refactor a bit + Code Cleanup + Add support for non-ES5 browsers
/*!
* imageloader : a jquery plugin for preloading images
* Version: 0.2.0
* Original Author: Nick Jonas - @nick-jonas
* Edited by: Ernesto Méndez - @derdesign
* Website: http://www.workofjonas.com
* Gist: https://gist.github.com/derdesign/5588986
* Gitbub: https://github.com/modernassembly/imageloader
* License: MIT
*/
;(function ($) {
$.imageloader = function(userOptions) {
var loadCount = 0;
var completedUrls = [];
var options = $.extend({
urls: [],
onComplete: function() {},
onUpdate: function(ratio, image) {},
onError: function(err) {}
}, userOptions);
for (var i=0,urls=options.urls,len=urls.length; i < len; i++) {
(function(item) {
var img = new Image(), error = false;
img.src = item;
img.onerror = function() {
loadCount++;
options.onError('Error loading image: ' + item);
};
$('<img/>').attr('src', item).load(function(res) {
loadCount++;
options.onUpdate(loadCount/len, urls[loadCount-1]);
if (loadCount === len) options.onComplete();
});
})(urls[i]);
}
};
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment