Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save scottymac/119618 to your computer and use it in GitHub Desktop.
Save scottymac/119618 to your computer and use it in GitHub Desktop.
(function($) {
$.fn.imageAsync = function(options) {
var settings = $.extend({}, $.fn.imageAsync.defaults, options);
return this.each(function() {
if( $(this).attr('src') ) {
var originalImageSrc = $(this).attr('src');
var imgHeight = $(this + '[height]').attr('height') || settings.h; // bug in firefox: even if img has no height attr, it will come back as 16
var imgWidth = $(this + '[width]').attr('width') || settings.w;
var originalImage = $(this)
.attr('src','')
.wrap('<span class="' + settings.progressClassName + '"></span>')
.parent('span')
.css('display','inline-block')
.width(imgWidth)
.height(imgHeight);
var img = new Image();
$(img)
.load(function() { originalImage.replaceWith(this); })
.error(function() { })
.attr('src', originalImageSrc)
.attr('width', imgWidth)
.attr('height', imgHeight);
}
});
}
$.fn.imageAsync.defaults = {
progressClassName: "progress"
};
})(jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment