$(document).ready(function () {
	$('.haut').mouseenter(function () { effet_onglet(this, true, true); });
	$('.haut').mouseleave(function () { effet_onglet(this, true, false); });
	$('.bas').mouseenter(function () { effet_onglet(this, false, true); });
	$('.bas').mouseleave(function () { effet_onglet(this, false, false); });
	$('#vignettes > li img').fadeOut(0);
	/*l_vignettes = $("#vignettes").get();*/
});

window.onload = function(){
	var delta = 50; // Hey ! Françoi ! C'est ici l'attente entre deux apparitions
	var fade = 250; // Hey ! Françoi ! C'est ici la durée du fade.
	var liste_vignettes = new Array();
	liste_vignettes = $('#vignettes > li img').get();
	for (var i=0;i<liste_vignettes.length;i++){
		$(liste_vignettes[i]).delay(delta*i).fadeIn(fade);
	}
}
function effet_onglet(cible, vers_le_haut, entre) {
	var vitesse = 250; // Hey ! Françoi ! C'est ici la vitesse de sortie des onglets.
	
	if (entre) {
		$(cible).children('img').clearQueue();
		if (vers_le_haut) {	$(cible).children('img').animate({top: 0}, vitesse); }
		else { $(cible).children('img').animate({top: 0}, vitesse); }
	} else {
		if (vers_le_haut) {	$(cible).children('img').animate({top: -16}, vitesse); }
		else { $(cible).children('img').animate({top: 40}, vitesse); }
	}
}