Contactame

Durante el desarrollo de mi pagina www.vicioalex.com he tenido la suerte de conocer un fantástico efecto. Se trata de un efecto Lightbox que permite mostrar en una ventana flotante sin necesidad de abandonar la página que estamos navegando con imágenes y grupos de imágenes, flash, videos youtube, pdf, iframes. Tuve que hacerle algunas modificaciones y Espero que les sea de tanta utilidad como a mi.
Este bonito efecto emergente que, sin salir de la página, te oscurece el fondo y te muestra la imagen a tamaño completo y en todo su explendor. Además, si queremos crear grupos, aparecen al pasar el ratón por determinadas zonas de la imagen, unos botones de “Anterior” y “Siguiente” que nos permite movernos por todo el grupo. Y por supuesto, el botón de cerrar, para volver a la página con las miniaturas. Este fantastico efecto es posible que hayáis visto en alguna web, y que podemos añadir a nuestras páginas de un modo muy sencillo, con resultados bastante aparentes.

El efecto Lightbox, Amplia las imágenes de un modo animado, ya que el cuadro se redimensiona ampliándose o reduciéndose según las dimensiones de la imagen y con un modo de transición suave hace un efecto muy bonito.El efecto permite trabajar con imágenes de distintos tamaños sin tener que parametrizar para cada uno de ellos distinto código, ya que se adapta a cualquier tamaño.

Media: Movies, Flash, PDF, videos de youtube.
Ejemplo de SWF
SWF Galería - varios swf
SWF desde una url externa
Abrir archivos PDF!
YouTube: Abrir videos con solo la URL

Fuentes Externas: Es como una ventana emergente!
Ejemplo web - Vista previa de cualquier sitio web desde la tuya!
Página externa - Esta página es local a tu dominio, pero se coloca en un iframe.

Iframe: Llame a un LightWindow desde un Iframe
Imágenes: Individuales o conjuntos galería!
Imagen - Sólo una imagen
Imagen externa - Una Imagen desde una url externa.
Galería de Imágenes - Muestra varias imagenes.
Galería de imágenes / Múltiples imágenes

Para formularios:
Formulario de ejemplo - Presentar un formulario en un LightWindow!
Formulario de ejemplo con una posición personalizada - Presentar un formulario en un LightWindow!

Paginas: De ancho fijo y Fluidos.
Fluid Page - This page does not have a width, the content is flexible.
Fixed Page - This page has a defined amount of space it needs or it will cause a horizontal scroll.
Monster Fixed Page - This page is just plain to big for the browser window unless you maximize a 30 inch monitor.
Set Dimensions - Set the dimensions of the window.

Contenido en línea: un pequeño contenido en la misma pagina.
Inline Content - Not a fan of AJAX? No worries, here you go.

Oh yeah, this content was pulled from within the page!
In order to get the LightWindow to fit the content, you have to define the height and width of a div in the inline div or send values for lightwindow_width and lightwindow_height in the url string. Personally I prefer the inner div method, this way you can gracefully degrade the link as I did into an anchor if javascript isn't available.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum hendrerit nibh at libero. Donec lectus enim, condimentum ac, scelerisque non, malesuada id, diam. Sed porta magna. Ut luctus bibendum nulla. Ut sit amet tellus. Aliquam ut justo. Duis sapien magna, sagittis et, molestie at, interdum a, mi. Nunc nisi arcu, tincidunt quis, adipiscing ac, faucibus convallis, ligula. Aenean lacinia laoreet nisi. Integer dictum. Maecenas porttitor dictum felis.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum hendrerit nibh at libero. Donec lectus enim, condimentum ac, scelerisque non, malesuada id, diam. Sed porta magna. Ut luctus bibendum nulla. Ut sit amet tellus. Aliquam ut justo. Duis sapien magna, sagittis et, molestie at, interdum a, mi. Nunc nisi arcu, tincidunt quis, adipiscing ac, faucibus convallis, ligula. Aenean lacinia laoreet nisi. Integer dictum. Maecenas porttitor dictum felis.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum hendrerit nibh at libero. Donec lectus enim, condimentum ac, scelerisque non, malesuada id, diam. Sed porta magna. Ut luctus bibendum nulla. Ut sit amet tellus. Aliquam ut justo. Duis sapien magna, sagittis et, molestie at, interdum a, mi. Nunc nisi arcu, tincidunt quis, adipiscing ac, faucibus convallis, ligula. Aenean lacinia laoreet nisi. Integer dictum. Maecenas porttitor dictum felis.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum hendrerit nibh at libero. Donec lectus enim, condimentum ac, scelerisque non, malesuada id, diam. Sed porta magna. Ut luctus bibendum nulla. Ut sit amet tellus. Aliquam ut justo. Duis sapien magna, sagittis et, molestie at, interdum a, mi. Nunc nisi arcu, tincidunt quis, adipiscing ac, faucibus convallis, ligula. Aenean lacinia laoreet nisi. Integer dictum. Maecenas porttitor dictum felis.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum hendrerit nibh at libero. Donec lectus enim, condimentum ac, scelerisque non, malesuada id, diam. Sed porta magna. Ut luctus bibendum nulla. Ut sit amet tellus. Aliquam ut justo. Duis sapien magna, sagittis et, molestie at, interdum a, mi. Nunc nisi arcu, tincidunt quis, adipiscing ac, faucibus convallis, ligula. Aenean lacinia laoreet nisi. Integer dictum. Maecenas porttitor dictum felis.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum hendrerit nibh at libero. Donec lectus enim, condimentum ac, scelerisque non, malesuada id, diam. Sed porta magna. Ut luctus bibendum nulla. Ut sit amet tellus. Aliquam ut justo. Duis sapien magna, sagittis et, molestie at, interdum a, mi. Nunc nisi arcu, tincidunt quis, adipiscing ac, faucibus convallis, ligula. Aenean lacinia laoreet nisi. Integer dictum. Maecenas porttitor dictum felis.