Carotte
un carousel accessible et responsive

Téléchargez carotte.min.js Accéder au repo Github

Comment installer Carotte ?

<script src="carotte.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $.fn.ready(function(){
    $('#slideshow').carotte();
  });
</script>

Options de carotte

$('#slideshow').carotte({
  duration:400, //durée du slide
  textPrev:'prev', //texte pour le bouton prev
  textNext:'next' //texte pour le bouton next
});

Carotte Autoslide

Téléchargez carotte.auto.min.js 
<script src="carotte.min.js" type="text/javascript"></script>
<script src="carotte.auto.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $.fn.ready(function(){
    $('#slideshow').carotte().autoslide();
  });
</script>

Options d'autoslide

$('#slideshow').carotte().autoslide({
  time:2000, //durée entre chaque slide
  textPlay:'play', //texte pour le bouton play
  textStop:'stop', //texte pour le bouton stop
  duration:400 //durée du slide
});
Téléchargez carotte.carousel.min.js 
<script src="carotte.min.js" type="text/javascript"></script>
<script src="carotte.carousel.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $.fn.ready(function(){
    $('#slideshow').carotte().carousel();
  });
</script>

Options de carousel

$('#slideshow').carotte().carousel({
  number:3, //groupe par n éléments (ici 3)
  oneVisible:false, //slide 1 par 1 et laisse 1 de visible pour le responsive
});
Téléchargez carotte.nav.min.js 
<script src="carotte.min.js" type="text/javascript"></script>
<script src="carotte.nav.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $.fn.ready(function(){
    $('#slideshow').carotte().nav();
  });
</script>

Télécharger carotte

Téléchargez carotte.min.js Accéder au repo Github
Crédits photos : Greenpouce, la Ferme de Sainte Marthe et la Ferme du Hanneton