/*
    imageFader v1.0b

    This is a jQuery plugin that i've write myself,
    by reading some tutorials at some different webpages.

    Basically this plugin creates a slideshow by taking
    the choosen images, and stack them on top of each other,
    and just slowly set the opacity to 0.
    
    But notice that this is only a beta, so some errors
    might occure.

    Jeppe Hundebøl Christiansen © 2010
*/

(function($) {
	$.fn.imageFader = function(options) {
	
		var defaults = {
			speed : 1000,
			pause : 30000,
		},
		
		options = $.extend(defaults, options);
			
		this.each(function() {
		
			var $this = $(this);
			
			//$this.wrap('<div class="imageshow-wrap"/>');
			
			$this.css({
				'width' : $this.children().width(),
				'position' : 'relative',
                'marginTop' : '-10px',
				'padding' : 0,
                'list-style' : 'none'
			});
			
			$this.children().css({
				'width' : $this.children().width(),
				'position' : 'absolute',
				'left' : 0
			});
			
			for (var i = $this.children().length - 1, y = 0; i >= 0; i--, y++) {
				$this.children().eq(y).css('zIndex', i + 9999)
			}
			
			fade();
			
			function fade() {
				setInterval(function() {
					$this.children(':first').animate({ 'opacity' : 0 }, options.speed, function(){
						$this
							.children(':first')
							.css('opacity', 1)
							.css('zIndex', $this.children(':last').css('zIndex') - 1)
							.appendTo($this)
					});
				}, options.pause);
			}
			
		});
	}
})(jQuery);	
