$(document).ready(function() {	
	


		
		
		
		var position = 0;	
		var nombreDeSlides = $(".slides").length;
		for (j=1; j<nombreDeSlides+1; j++)	{ $("#deco_diapo").append("<a href=\"#\" rel=\""+j+"\">" +j+"</a>")};
		$("#deco_diapo>a").wrapAll("<div class=\"paging\"></div>");
		$(".slides img").removeAttr("class");
	
	function cacher() {
		$(".currentslide img").animate({ "opacity": "toggle"}, "slow");		
		$(".slides").eq(position).removeClass("currentslide");
		}
	
	function afficher() { 
		$(".slides").eq(position).addClass("currentslide");
		$(".currentslide img").animate({ "opacity": "toggle"}, "slow");		
		}
	
	$(".slides img").hide();	
	$(".paging a:first").addClass("active");
	afficher();
	
	
rotate = function(){
    $(".paging a").removeClass('active'); 
    $active.addClass('active');	
	position = $(".active").attr("rel")-1;						
	afficher();
   
}; 


rotateSwitch = function(){
    play = setInterval(function(){
		cacher();
        $active = $('.paging a.active').next(); 
        if ( $active.length === 0) { 
            $active = $('.paging a:first'); 
        }		
        rotate(); 	
    }, 6000); 
};

rotateSwitch(); 
	
$(".paging a").click(function() {
    $active = $(this);    
	cacher();
    clearInterval(play); 
    rotate();
    rotateSwitch(); 
    return false; 
});
	
      });