Sencillo slider cíclico con Cycle lite. Programación en Castellano.

Categorías destacadas

Artículo

Inicio Artículo Lenguajes de script Javascript

¡votar!

Sencillo slider cíclico con Cycle lite

Cycle lite es un plugin para jQuery muy ligero que nos permite crear un slider cíclico de una forma muy sencillo. A diferencia de otros plugin, este se caracteriza por no tener tantas opciones como otros plugin, pero a su favor está que al ser más liviano, requiere menos recursos.

El funcionamiento es muy sencillo, ya que una vez descargada la librería e incluida en nuestro proyecto, bastaría con hacer la siguiente llamada.

$('#slideshow1').cycle()

Esta es la llamada sencilla, pero se puede hacer algo más compleja, si modificamos las características por defecto que trae el plugin. Un ejemplo podría ser el siguiente.

$('#slideshow3').cycle({ 
delay:  2000, 
speed:  500, 
before: onBefore 
}); 
function onBefore() { 
$('#title') 
.html(this.alt); 
};

En este caso le estamos indicamos la velocidad de retardo y la velocidad de paso de las diapositivas. También le estamos indicando una llamada a una función que lo que hace es mostrarnos el Alt encima de la imagen.

La lista de opciones que podemos utilizar son:

Timeout: Milisegundos entre transiciones de diapositivas
speed: Velocidad de la transición.
Next: Id del elemento que sirve para pasar al siguiente elemento.
Prev: Id del elemento que sirve para pasar al anterior elemento.
Before: se le pasa el nombre de una función que se debe de ejecutar después de la carga.
After: nombre de la función que se debe de ejecutar antes.

Pueden ver más información al respecto en su sitio oficial.