jQuery Simple Thumbs - Crea simples galerías de imágenes de una forma fácil.
- Inicio
- Desarrollo web
- Scripts / Galerías de fotos
- Simple thumbs
Más sobre el programa :: Requerimientos :: Videos :: Actualizaciones
jQuery simple Thumbs es una sencilla pero muy buena opción en caso de necesitar mostrar una tira de imágenes o thumbnails y al cliquear en una de las miniaturas, poder visualizar la fotografía.
El script es un complemento para la conocida librería jQuery, muy fácil de instalar y configurar, además de ser completamente gratuito.
A continuación puedes ver como instalar el ejemplo en tu sitio web y otra información.
Mas información sobre el programa.
¿ En que consiste el plugin ?
Como se dijo anteriormente, el script permite insertar fácilmente una tira de thumbnails y al hacer clic en un gráfico poder visualizar la imagen mostrando también un sencillo efecto de transición entre cada pase de imagen. ( Contiene un solo efecto de transición )
En caso de necesitar mostrar muchas imágenes, es posible navegar por la galería utilizando controles de navegación para la imagen previa y siguiente, como también iniciar un slideshow para cambiar la fotografía en forma automática cada un cierto intervalo de tiempo ( Esto último lo puedes ver en el segundo ejemplo publicado en la web del autor).
Captura de pantalla:
Instalar el script en la página web.
En la web del autor , en este enlace, podrás encontrar además del plugin, como poder insertar las imágenes para crear la galería. ( Crear los DIVS, asignar el atributo Class a las imágenes etc ..)
También ( al final de la página ), muestra como configurar otros parámetros y opciones, como por ejemplo:
- Precargar todas las imágenes de la galería antes de poder utilizarlas. Esta opción es muy útil si la galería contendrá muchas imágenes.
- Establecer y definir los botones Anterior y Siguiente imagen.
- Determinar el intervalo en milisegundos en caso de activar el slideshow.
- La velocidad de transición entre cada gráfico.
- Definición de funciones CallBack.
- Otros.
Todas las opciones anteriores, las puedes configurar abriendo el archivo Javascript con tu editor de páginas web. Los parámetros y variables son los siguientes:
jQuery("#thumbnails").simplethumbs({
slideshow: "",//
preload: true,// si está en True se cargarán automáticamente las imágens antes de comenzar con la presentación de diapositivas.
activeClass: "active",// Nombre de la Clase HTML que contiene el Thumbnail o imagen
speed: 600,// Velocidad para el efecto de transición entre las imágenes.
next: "#next-image",// Es el botón para la imagen siguiente de la barra de navegación.
prev: "#prev-image",// Es el botón para la imagen anterior de la barra de navegación.
wrap: false,// Si está en true, cuando se llega a la última imagen, comienza nuevamente desde el principio, cuando se utilizan los botones "siguiente" y el botón "anterior"
cycle: false,// Si está en true, el slideshow comenzará de forma automática.
cycleWrap: true,// Permite detener la presentación de diapositivas cuando se llega al final.
interval: 3000,// tiempo o delay entre el cambio de las imágenes.
reverse: false,// si está en true, cuando llegue al final se mostrará la presentación desde el final hasta el principio.
startCycle: "#start-cycle",// Para iniciar el slideshow
stopCycle: "#stop-cycle",// Para detener el slideshow
});
Buscar programas
Introduce los términos de búsqueda ...
Enlaces patrocinados.
Detalles y descargar
Si te ha gustado esta página, programa o artículo puedes votar haciendo clic en este botón: