//au chargement de la page 
	//largeur de l'image 
	var lastSlide = "slide1";
	var actualAutoSlide = "slide3"
	var lastid = "#item1";
	var tailleMoveSlide=512;
	//vitesse du slide 
	var vitesseSlide=500; 
$(document).ready(function(){	
	
	//au clic sur chaque lien on fait l'annimation correspondante 
	//c'est à dire qu'on déplace le div slidebox 
	$(".slide0").mouseover(function(){
	$("#slidebox")
	.animate({right: "0"}, vitesseSlide) 
	return false; 
	}); 

	$(".slide1").mouseover(function(){
		anim_slide("slide1", "#item1", 0);
	}); 

	$(".slide2").mouseover(function(){
		anim_slide("slide2", "#item2", 1);
	});

	$(".slide3").mouseover(function(){
		anim_slide("slide3", "#item3", 2);
	});
	
	// Auto animation
	setInterval('auto_anim()', 10000);

});


function auto_anim(){
	if($('#slidebox').css('right')=='1024px'){ 
		//on revient à zéro 
		anim_slide("slide1", "#item1", 0); 
	}
	//si on est à la seconde position (400px) 
	else if($('#slidebox').css('right')=='512px') 
	{ 
	//on va à la troisième (position actuelle + taille(400)=800) 
	anim_slide("slide3", "#item3", 2);
	}
	//sinon on est dans la 1ère position, on va à la seconde 
	else 
	{ 
	anim_slide("slide2", "#item2", 1);
	} 




}
function anim_slide(actuel_slide, idslide, tailleMove){
	if(actuel_slide != lastSlide){
		
		$(idslide).attr("class", "boite_item_slide_actif");
		$(lastid).attr("class", "boite_item_slide");
		$("#slidebox")
		if(actuel_slide == "slide1"){ 
			//on revient à zéro 
			$('#slidebox').animate({right: '0'}, vitesseSlide) 
		}
		//si on est à la seconde position (400px) 
		else if(actuel_slide == "slide3") 
		{ 
			//on va à la troisième (position actuelle + taille(400)=800) 
			$('#slidebox').animate({right: '1024'}, vitesseSlide) 
		}
		//sinon on est dans la 1ère position, on va à la seconde 
		else 
		{ 
			$('#slidebox').animate({right: '512'}, vitesseSlide) 
		} 
		lastSlide = actuel_slide;
		lastid = idslide;
	}
	return false; 
};