var tab = 1;
var to_tab = 0;
jQuery(document).ready(function(){


	jQuery('span#span1').click(function() {
		jQuery('#plop').animate({ left: "0px" });/*0*/
	});
	jQuery('span#span2').click(function() {
		jQuery('#plop').animate({ left: "-530px" });/*-549*/
	});
	jQuery('span#span3').click(function() {
		jQuery('#plop').animate({ left: "-1060px" });/*-1098*/
	});
	jQuery('span#span4').click(function() {
		jQuery('#plop').animate({ left: "-1590px" });/*-1647*/
	});
	
	
jQuery('#derniers').hover(function(){clearTimeout(to_tab);},function(){to_tab = setTimeout("changeTab()",2000);});
		
		
	jQuery('#derniers li span').hover(
		function() {
			jQuery(this).parent().addClass('hover');
		},
		function() {
			jQuery(this).parent().removeClass('hover');
		}
	).click(
		function() {
			jQuery('#derniers li').each(function() {
				if(jQuery(this).hasClass('selected'))
					jQuery(this).removeClass('selected');
			});
			jQuery(this).parent().addClass('selected');
		}
	);
	

	
	to_tab = setTimeout("changeTab()",2000);
	
		
});

function changeTab()
{
	if(tab==1)
		tab=2;
	else
		tab=1;
	
	
	jQuery('#derniers li').each(function() {
				if(jQuery(this).hasClass('selected'))
					jQuery(this).removeClass('selected');
			});
			
			
	if(tab==2)
	{
		jQuery('#plop').animate({ left: "-530px" });
		jQuery('span#span2').parent().addClass('selected');
	}
	else
	{
		jQuery('#plop').animate({ left: "0px" });
		jQuery('span#span1').parent().addClass('selected');
	}

	to_tab = setTimeout("changeTab()",5000);
}
