(function($) {
	$.fn.crossfade = function(settings) {
		
		var config = {
			crossfade: true,
			fadeDuration: 'normal',
			delay: 1000
		};
 		if (settings) $.extend(config, settings);
		
		this.each(function() {
			var $container = $(this);
			var $items = $('> *', this);
			
			// set necessary css
			$container.css({
				position: 'relative',
				overflow: 'hidden'
			});
			$items.css({
				position: 'absolute'
			});
			
			// hide all except the first
			$items.filter(':gt(0)').hide();
			
			// if the user wants to click the link, do not fade
			var hovered = false;
			$items.hover(function(){ hovered = true; }, function(){ hovered = false; });

			// get height of the first one and set as default
			// get the highest item and set its height as default
			var h = 0;
			
			$.each($items, function (key, value) {
				var lh = $(value).height();
				if (lh > h)	h = lh
			});
			
			$container.height( h );
			
			// the actual crossfade
			var interval = setInterval(function(){
				// do not fade if the user hovers the link
				if (hovered) return;

				// get items for crossfade
				var actual = $items.filter(':visible');
				// get next
				var next = actual.next();
				if (next.length == 0) next = $items.first();
				
				if (config.crossfade) {
					actual.fadeOut( config.fadeDuration );
					next.fadeIn( config.fadeDuration );
				} else {
					actual.fadeOut( config.fadeDuration, function(){
						next.fadeIn( config.fadeDuration );
					});
				}
			}, config.delay);
		});

		return this;
	};
})(jQuery);

