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:
- Descarga en Plugin
- 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> - 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.
- «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/
Acabo de probarlo y funciona muy bien, muchas gracias.