Xyberneticos

mooSlideBox v3 un pequeño script que podremos usar como extensión o bien como reemplazo del tradicional "lightbox". Creo que entonces es fácil deducir que mooSlideBox v3 nos permitirá lograr un efecto similar al logrado con lightbox. Solo que mooSlideBox presenta algunas variantes u otra buena forma de mostrar otro tipo de contenido, algo que podrá ser útil, sobre todo relacionado a porfolios y ese tipo de cosas. Básicamente nos permite luego de dar un click en un enlace, abrir un Div flotador en el cual podremos mostrar nuestras fotos y a la vez agregar una descripción larga y un titulo relacionado a esa imagen. La parte visual desde ya es muy agradable, mas aun, el efecto que se produce al hacer aparecer este div flotador o bien lightbox. mooSlideBox funciona en IE 6 / 7, Opera y Firefox.

Ver Demo Funcionando - Descarga mi ejemplo (contiene todos los archivos) - Web mooSlideBox v3

Instalacion:

Lo primero sera descargar las librerias necesearias mootools.js y mooSlideX.js

Realizaremos la llamada correspondiente a mootools, copiando y pegando el siguiente código dentro de nuestras etiquetas < Head > ….< / Head > ( en wordpress seria en el archivo Header.php).

Para mostrar en un enlace el deslizador con una imagen, un título y una descripción de texto, podemos hacerlo llamando de esta manera:

Es decir que a nuestros enlaces añadimos la etiqueta rel = "designSlide". La diapositiva puede contener un título y una descripción. En el atributo “title” agregamos el nombre de titulo, separándolo de la descripción con un "::". Inclusive se puede ver que la llamada al script mooSlideBox lo haremos desde aquí.