(function() {
	jQuery.fn.loadFade = function(settings) {

		var config = {
			'time':400,
			'delay':100
		};
		if( settings ) {
			$.extend(config, settings);
		}

		return this.each( function() {

			var $obj = $(this);
			
			// if this is not an img element
			if( $obj[0].nodeName.toUpperCase() !== 'IMG' ) {
				return;
			}

			$obj.
				css({opacity: 0.0}). // set the img opacity to transparent
				bind('load readystatechange', function() { // bind to the load and readystatechange events
					setTimeout( function() { // wait for config.delay miliseconds after the event to prevent glitching
						$obj.animate({opacity: 1.0}, config.time, function() { // fade the img to opaque over config.time miliseconds
							$obj.unbind('load readystatechange'); // the image has been fadded in so unbind the events
						});
					}, config.delay);
				});
	
			this.src = this.src; // give browsers (IE) another chance to trigger event handlers for the img
	
		});
		
	};
})(jQuery);
