Carousel infinito en jQuery

No es la primera vez que hablamos de un Plugin para jQuery en VitaminaGeek.com, un ejemplo similar a este podría ser el Slider jQuery presentado hace unos meses.

En esta oportunidad traemos carouFredSel, un complemtento que toma cualquier elemento html y lo transforma en un carousel sin limite.

Este carousel puede funcionar horizontal o verticalmente, y puede configurarse para correr automaticamente o al ser activado por el usuario.

La instalación es realmente sencilla:

1. Descarga en Plugin
2. Incluye en tu documento HTML los archivos necesarios para el funcionamiento del Carousel:
   <script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.carouFredSel.js"></script>
3. Crea los contenidos que deseas incluir en el carousel, por ejemplo:
   <div id="foo">
<img src="img1.jpg" />
<img src="img2.jpg" />
<img src="img3.jpg" />
<img src="img4.jpg" />
<img src="img5.jpg" />
</div>


   También puedes hacerlo con otros tags, como pueden ser listas o divs. Lo único que debes tener en cuenta es que este armado en un formato válido.

4. “Ejecuta” el plugin jQuery:
   $(document).ready(function() {
// Using default configuration
$("#foo1").carouFredSel();
// Using custom configuration
$("#foo2").carouFredSel({
items : 2,
direction : "up",
scroll : {
items : 1,
effect : "easeOutBounce",
duration : 1000,
pauseOnHover : true
}
});
});

Puedes ver el listado de opciones disponibles en el plugin en el apartado de configuración: http://caroufredsel.frebsite.nl/configuration.php

Enlace: http://caroufredsel.frebsite.nl/

Comentarios

comentarios