jQuery(function( $ ){
	$('#centre').serialScroll({
		target:'#scroll',
		items:'li',
		prev:'img.prev',
		next:'img.next',
		axis:'x',
		navigation:'#navigation li a',
		duration:1000,
		force:true,
		cycle:true,
		constant:false,
	  onBefore:function( e, elem, $pane, $items, pos ){
			var endId = elem.id;
      var clicPos = pos;
			
			$("#navigation img").each(function (i) {
        if (clicPos == i) {
            $(this).replaceWith('<img src="ressources/web/img/bt-select-r.png" width="8" height="8" />');
				} else {
  				$(this).replaceWith('<img src="ressources/web/img/bt-select-g.png" width="8" height="8" />');
				}
      });			

			if (endId == 'scroll4') {
				$('#bt-prev img').fadeIn("slow");
			} else if (endId == 'scroll0') {
				$('#bt-prev img').fadeOut("slow");
				$('#bt-next img').fadeIn("slow");
			} else {
				$('#bt-prev img').fadeIn("slow");
				$('#bt-next img').fadeIn("slow");
			}
		},

		onAfter:function( e, elem, $pane, $items, pos ){
			currentId = e.id;
		}
	});
});