Modifier un carroussel en jquery

Bonjour à tous

J'essaye de modifier un carrousel pour inclure des flèches précédentes et suivantes, mais je ne m'en sors pas .. Une âme charitable pourrait-elle me mettre sur la voie? Voici le code :

/******************************************************************************/
/*                             Javascript                              */
/******************************************************************************/
 
var nav = new Array();
nav['section'] = 1;
nav['article'] = 1;
 
var sections = [null];
var articlesPerSection = new Array();
var currentArticle = new Array();
 
 
 
jQuery(document).ready(function() {
	//----------------------------------
	// On génere un carousel pour les 
	// vignettes via JCarousel
	//----------------------------------	
	/*
	jQuery('.galerie_alaune').jcarousel({
 
		scroll: 1,
		initCallback: initCarousel,
		itemFirstInCallback: {
		}, 
		buttonNextHTML: null,
		buttonPrevHTML: null
	});
	*/
 
	//----------------------------------
	// On génere les élements HTML et 
	// styles
	//----------------------------------	
 
	jQuery('#focus_alaune').wrap('<div id="container_alaune" class="container" />');
	jQuery('.container').css("float","left");
	jQuery('.container').css("overflow","hidden");
	jQuery('.container').css("position","relative");
 
	jQuery('.container').css("width","510px");
	jQuery('.container').css("height","250px");
 
	jQuery('.alauneBloc').css("float","left");
	jQuery('.alauneBloc').css("position","relative");
 
	//----------------------------------
	// On cherche le nombre d'articles
	//----------------------------------		
	jQuery('#focus_alaune').each(function(){
		sections.push(jQuery(this).attr('id'));
		articlesPerSection[ jQuery(this).attr('id') ] = jQuery(this).children('.alauneBloc').length;
		currentArticle[jQuery(this).attr('id')] = 1;
 
		articlesPerSection.length++;
		currentArticle.length++;
	});		
 
	totalArticles = articlesPerSection[ sections[ nav['section'] ] ];
 
 
	//----------------------------------
	// On génere la taille du bloc 
	// conteneur en fonction du nombre 
	// d'articles...
	//----------------------------------		
	for (section in articlesPerSection){
		//jQuery('#' + section).width( (100 * articlesPerSection[section] ) + '%' ).height( (100 / (sections.length - 1)) + '%' );
		jQuery('#' + section).width( (100 * articlesPerSection[section] ) + '%' ).height('250px' );
		jQuery('#' + section).children('.alauneBloc').width( (100 / articlesPerSection[section] ) + '%' );
	}
 
	//----------------------------------
	// On génere la barre de navigation
	// avec les styles qui vont bien
	//----------------------------------		
 
	createNav();
 
 
	//----------------------------------
	// On fait appel à une fonction auto
	// toute les 4 secondes au chargement
	//----------------------------------
 
	autoTimer = setInterval(function(){
		autoRun();
	},4000);
 
 
 
 
	jQuery('.nav_alaune_menu a').each(function(i){
		jQuery(this).click(function(){
			clearInterval(autoTimer);	
			jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/play.jpg');
			goArticle(i);
 
		});
	});	
 
	jQuery('.survol_carousel').each(function(i){
		jQuery(this).click(function(){
			clearInterval(autoTimer);	
			jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/play.jpg');
			goArticle(i);
		});
	});		
 
 
	jQuery('.commandes a').click(function(){
		if(jQuery('.commandes img').attr('src') == 'typo3conf/ext/e_tca_extented/res/template/images/pictos/stop.jpg'){
 
			clearInterval(autoTimer);	
			jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/play.jpg');
		}else{
			jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/stop.jpg');
 
			autoTimer = setInterval(function(){
				autoRun();
			},6000);			
		}
	});
 
});
 
 
function initCarousel(carousel) {
	hoverCarousel();
};
 
 
 
function hoverCarousel(){
	jQuery('.galerie_alaune li').each(function(iTem){
		var liItem = jQuery('.galerie_alaune li:eq('+iTem+')');
		var thumbItem = liItem.children("div");
 
		liItem.hover(
			function(){
				thumbItem.show();
				if(thumbItem.length>0){
					if(thumbItem.css('display')=='none'){
						thumbItem.show();
					}
				}
			},
			function(){
				if(thumbItem.length>0){
					if(thumbItem.css('display')=='block'){
						thumbItem.hide();
					}
				}
			}
		);
 
		iTem++;
  });
}
 
function createNav(){
	/*jQuery('.nav_alaune').appendTo('.container');*/
	jQuery('#focus_alaune').css('padding','0px 0px 0px 0px');
	jQuery('#focus_alaune .alauneBloc .alaune_image a').css('display','block');
	jQuery('.nav_alaune').css('margin','0px 0px 0px 0px');
 
	//jQuery('.nav_alaune_menu').appendTo('.nav_alaune');
 
	jQuery('.nav_alaune_menu a').attr('href','javascript:void(0);');
 
	jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/stop.jpg');
	jQuery('.commandes a').attr('href','javascript:void(0);');
 
}
 
function autoRun(){
	if(nav['article']>=totalArticles){
		nav['article']=0;
	}			
	goArticle(nav['article']);
}
 
function goArticle(cpt){
	nav['article'] = cpt+1;
	currentArticle[ sections[ nav['section'] ] ] = nav['article'];
 
 
	contents = jQuery( '#' + sections[ nav['section'] ] );
	newMargin = (-1 * (cpt) * 100) +'%';
	contents.animate({'marginLeft':newMargin}, 500, 'swing');
 
	swapClass(jQuery('.nav_alaune_menu li'),cpt,'','active');
}
 
function swapClass(item,pos,classOff,classOn){
	item.attr('class',classOff);	
	item.eq(pos).attr('class',classOn);	
}

Bonjour,
quel est le script d'origine car il me semble qu'il y a des éléments de navigations déjà inclut ?

function createNav(){
	/*jQuery('.nav_alaune').appendTo('.container');*/
	jQuery('#focus_alaune').css('padding','0px 0px 0px 0px');
	jQuery('#focus_alaune .alauneBloc .alaune_image a').css('display','block');
	jQuery('.nav_alaune').css('margin','0px 0px 0px 0px');
 
	//jQuery('.nav_alaune_menu').appendTo('.nav_alaune');
 
	jQuery('.nav_alaune_menu a').attr('href','javascript:void(0);');
 
	jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/stop.jpg');
	jQuery('.commandes a').attr('href','javascript:void(0);');
 
}

est ce une modification de ta part ?

Bonjour,

Non c'était déjà dans le script, mais au final j'ai réussi à résoudre mon problème en créant de nouvelles fonctions. Voici la solution si cela peut servir un jour à quelqu'un:

function createNav(){
	/*jQuery('.nav_alaune').appendTo('.container');*/
	jQuery('#focus_alaune').css('padding','0px 0px 0px 0px');
	jQuery('#focus_alaune .alauneBloc .alaune_image a').css('display','block');
	jQuery('.nav_alaune').css('margin','0px 0px 0px 0px');
 
	//jQuery('.nav_alaune_menu').appendTo('.nav_alaune');
 
	jQuery('.nav_alaune_menu a').attr('href','javascript:void(0);');
 
	jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/stop.jpg');
	jQuery('.commandes a').attr('href','javascript:void(0);');
 
//////////////////////////////////////////////////////////////////////////////////////
	// ajout des fleches de navigation
	jQuery('.nav_alaune_prec img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/prec.png');
	jQuery('.nav_alaune_prec a').attr('href','javascript:goPrev() ;');
 
	jQuery('.nav_alaune_suiv img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/suiv.png');
	jQuery('.nav_alaune_suiv a').attr('href','javascript:goNext();')
 
}
 
//----------------------------------
// fonction goNext()
//----------------------------------
 
function goNext(){
	clearInterval(autoTimer);
	jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/play.jpg');
	if(nav['article']>=totalArticles){
		nav['article']=0;
	}	
 
	nav['article']++;
 
	goArticle(nav['article']-1);
}
 
//----------------------------------
// fonction goPrev()
//----------------------------------
 
function goPrev(){
	clearInterval(autoTimer);
	jQuery('.commandes img').attr('src','typo3conf/ext/e_tca_extented/res/template/images/pictos/play.jpg');
	if(nav['article']<=1){
		nav['article']=totalArticles+1;
	}		
	nav['article']--;
 
	goArticle(nav['article']-1);
}