YoxView es un visualizador de imágenes con jQuery. Es muy vistoso, el efecto conseguido es similar al Lightbox pero algo renovado en apariencia y animación y además es muy sencillo de implementar.
Principales características:
- Redimensiona las imágenes para que cuadren dentro de la ventana del navegador.
- Las imágenes pueden ser guardadas con anterioridad en la caché.
- Soporta múltiples instancias en la misma página.
- Es personalizable, permitiendo incluso que varias instancias en una misma página tengan una apariencia diferente.
- Soporta varios idiomas y escritura bidireccional.
- En modo slideshow habilitado, reproduce las imágenes automáticamente.
- Soporta navegación de imágenes por teclado.
- Es amigable con los motores de búsquedas para conseguir así buen posicionamiento de las imágenes.
- Si dudas unos de los puntos más fuerte es su fácil integración ya que no hace falta tener conocimientos sobre jQuery.
Implementación
Primero tenemos que poner las imágenes en miniatura (thumbnail) en un contenedor HTML:
<div class="yoxview">
<a href="images/01_full.jpg"><img src="images/01_thumbnail.jpg" alt="First image" /></a>
<a href="images/another_full.jpg"><img src="images/a_thumbnail.png" alt="Second image" /></a>
</div>
Segundo tenemos que enlazar la el archivo JS en la sección HEAD del código HTML de la página:
<script type="text/javascript" language="javascript" src="yoxview/yoxview-init.js"></script>
Tercero tenemos que editar el archivo que acabamos de enlazar y agregar la ruta del archivo en la variable yoxviewPath:
yoxviewPath = "yoxview/";
En el mismo archivo, debemos quitar el comentario a la línea:
LoadScript(yoxviewPath + "yoxview-nojquery.js");
Opciones de configuración
Las opciones de personalización incluyen: definir el color del fondo (background) y la opacidad del mismo, el tiempo para el autoplay, el idioma, etc.
$("#thumbnails").yoxview( {backgroundColor: 'Blue', playDelay: 5000} );
YoxView
Sitio/descargar: www.yoxigen.com/yoxview/Default.aspx
