Nivo Slider : Comment l'utiliser?

4 mai 2010 à 8:50:11

Bonjour à tous,
j'aimerais mettre un slider d'images sur page d'accueil(Nivo Slider,)
j'ai alors téléchargé sur le site suivant
http://nivo.dev7studios.com/
un pack pour le faire. Si vous le connaissez bien, pourriez vous m'aider à l'utiliser
parce que j'y arrive pas du tout. J'y travaille depuis 5 jours maintenant

et je suis pas arrivé à le faire fonctionner :euh:

. Merci d'avance...

We build buildings developers...

Ptt-homme

4 mai 2010 à 9:15:39

Tu peux déjà commencer par nous donner le bout de code que tu as fait, parce qu'il y a pas franchement de quoi casser une pate à un canard nivo^^ installation.

arnoldwk

5 mai 2010 à 23:39:54

<head>
<link rel="stylesheet" href="css/nivo-slider.css" type="text/css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.nivo.slider.pack.js" type="text/javascript"></script>
</head>
<body>
<code type="javascript">
<script type="text/javascript">
$(window).load(function() {
	$('#slider').nivoSlider({
		effect:'random',
		slices:15,
		animSpeed:500,
		pauseTime:3000,
		startSlide:0, //Set starting Slide (0 index)
		directionNav:true, //Next & Prev
		directionNavHide:true, //Only show on hover
		controlNav:true, //1,2,3...
		controlNavThumbs:false, //Use thumbnails for Control Nav
		controlNavThumbsSearch: '.jpg', //Replace this with...
		controlNavThumbsReplace: '_thumb.jpg', //...this in thumb Image src
		keyboardNav:true, //Use left & right arrows
		pauseOnHover:true, //Stop animation while hovering
		manualAdvance:false, //Force manual transitions
		captionOpacity:0.8, //Universal caption opacity
		beforeChange: function(){},
		afterChange: function(){},
		slideshowEnd: function(){} //Triggers after all slides have been shown
	});
});
</script></code>

<div id="container">
<div id="Header"></div>
<div id="Slider"> 
<img src="images/Banner_Sommet.png" alt="" />
<img src="images/Banner_Sommet2.png" alt="" />
<img src="images/Banner_Sommet3.png" alt="" />
</div>

voilà c'est mon code, mais mon souci actuel son les images il y a 3 images mais seulement la première et la dernière ce succède. Celle du milieu est inopérant et qui plus est il raffiche la première image brutalement après avoir effectué la transition image 1 vers image 3.
Comment puis-je corriger cela, afin que la transition soit:
image1 => image2 => image3 puis image3 => image2 => image1
et vice-versa encore merci.

We build buildings developers...