/********************************************************************

Dans les sites ou il y a plusieurs bannières en rotation 

Exemple : 

<div id="banner">
	<img src="/images/banners/banner1.jpg" alt="" />
	<img src="/images/banners/banner2.jpg" alt="" />
	<img src="/images/banners/banner3.jpg" alt="" />
	<img src="/images/banners/banner4.jpg" alt="" />
</div>

IMPORTANT : 

	METTRE DANS VOTRE CSS : 
	
	#banner {
		position:relative;
		height:(height de une banner)px;
	}
	
	#banner img {
		position:absolute;
	}
	
INITIALISATION : 

	BASIC : (5 secondes par image, fade de une seconde)
		jQuery(function() { 
			jQuery('#banner').fadeimg(); 
		});
		
	ADVANCED : 
		jQuery(function() { 
			jQuery('#banner').fadeimg({interval : 7, fade : .5}); 
		});

*********************************************************************/

jQuery.fn.fadeimg = function(params) {
	var defaults = {
		'interval' : 5, // INTERVAL BETWEEN FADE IN SECONDS
		'fade' 	   : 1 // FADE DURATION IN SECONDS, DECIMALS ACCEPTED.	
	}
	
	if (typeof(params) == 'undefined') params = {};
	
	var settings = jQuery.extend(defaults,params);
	
	return this.each(function() {
    jQuery(this).find('img').hide();
    jQuery(this).find('img:first').show();
    var curImg = 0;
    var $this = this;
   
    var changeImg = function() {
			curImg++;
			if (curImg > jQuery($this).find('img').length-1) curImg = 0;	
			jQuery($this).find('img:visible').fadeOut(settings.fade*1000);
			jQuery($this).find('img:eq('+curImg+')').fadeIn(settings.fade*1000); 
		}
		setInterval(changeImg,settings.interval*1000);
  });

}

