Hermoso y sencillo javascript TinySlideShow

javascriptDesde leigeber.com siempre podemos ver material de calidad, en este caso nos trae una hermosa galería de imagenes con un slider para seleccionar la imagen deseada. Si no hay acción por parte del usuario, las imagenes correran solas, y tenemos disponible la opción de agregar un texto descriptivo.

Vean el demo de la galería para que no les queden dudas sobre lo que digo. Ahora veamos como se pone en marcha esto. El código lo descargan desde el site del autor en TinySlideShow 

Deben subir los dos archivos .js para que funcione, y tienen un ejemplo con imagenes cargadas en el zip para que puedan basarse en él.

<ul id="slideshow">
<li>
<h3>Image One</h3>
<span>photos/image-one.jpg
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam ut urna. Mauris nulla. Donec nec mauris. Proin nulla dolor, bibendum et, dapibus in, euismod ut, felis.</p>
<a href="#"><img src="thumbnails/image-one.jpg" alt="Image One" /></a>
</li>
<li>
<h3>Image Two</h3>
<span>photos/image-two.jpg</span>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam ut urna. Mauris nulla. Donec nec mauris. Proin nulla dolor, bibendum et, dapibus in, euismod ut, felis.</p>
<img src="thumbnails/image-two.jpg" alt="Image Two" />
</li>
</ul>

El autor nos señala que cada li representa a una imagen, el h3 es el título de la imagen y p la descripción (el texto que aparece debajo). Con las etiquetas span indicamos la ruta a la imagen en tamaño completo. Finalmente en el site mencionado encontrarán los valores que pueden cambiar para modificar el modo en que se ven las imagenes (velocidad del show, transparencia, colores) desde el archivo javascript.

Es un complemento muy liviano para añadir a una web.

TinySlideShow

Algunas Galerías fotográficas fáciles de usar

Las galerías de imagenes utilizando librerías y plugins javascript simplemente me encantan. Son fáciles de colocar, quedan siempre bien, no generan una página pesada y el resultado final te deja casi siempre conforme. En este caso hago esta entrada para mi amigo Nightw (ale) que andaba buscando un catálogo mas extenso de galerías,

jQuery: jqGalScroll v2.1 (Photo Gallery) 

Este plugin de jQuery creado por Benjamin Sterling (quién tiene también algún plugin interesante de galería para wordpress) toma imagenes que pueden ser pasadas con un scroll vertical, horizontal o diagonal. Crea  automaticamente una paginación para las imagenes.

 S3Slider jQuery Plugin

Esta galería nos permite un muestreo de imagenes (con fade in y out) con el agregado de una capa con texto que emerge para darnos la descripción. Por supuesto solo la imaginación es un límite, pero el autor nos deja el codigo de varios ejemplos muy bonitos por si no nos inspiramos

 

PrettyGallery

Este plugin lleva su tiempo, es bastante antiguo (funciona en ie 6 y ff 2 a la perfección) pero muy efectivo. Genera una vista de las imagenes con estilo “diapositiva” para que corran horizontalmente, cuando una de ellas es seleccionada utiliza un clon de Lightbox para mostrarla en el tamaño deseado.

EOGallery

También utilizando jQuery y un plugin para el lightbox, esta galeria lo que nos permite es ir pasando imagenes de un modo mas llamativo, ya que agranda un poco la miniatura cuando pasa al lugar principal y luego la devuelve al tamaño original. Con un click se activa el tamaño “natural” de la imagen en un lightbox. Tiene un modo “autoplay” en el que iran pasando solas las imagenes y debajo de las mismas se despliega una caja con texto para mejorar las descripciones de las fotos.

Pirobox

Un plugin de jquery al que debo reconocerle algo: está muy bien presentado. Su propio website es mas llamativo que los anteriores, a mi entender. Lo que realiza el plugin es, basicamente, un show automático en un lightbox muy atractivo. Sencillisimo de instalar.

Threads en el foro con diferentes galerías: