Crear el efecto de lightbox solo con CSS Publicada el Domingo 26 de Agosto de 2007 a las 12:37 am por Infected-FX

Leyendo SigT me encuentro con este tutorial, interesante para aquellos que no deseen utilizar javascript para crear el efecto de Ligthbox, pueden usar esta técnica utilizando únicamente CSS.
Pueden ver el resultado final de este tutorial. Trata solamente de mostrar 2 divs al momento de dar “clic” uno el overlay que hará que nuestra pantalla se haga un poco más oscura y content que será donde mostraremos nuestro contenido.


Alejandro Torres
Agosto 26, 2007 a las 10:21 am
Muy bueno infectedfx, ya hacia falta algo asi sin tener que usar javascript :P
wydblog
Agosto 26, 2007 a las 2:36 pm
jaaja sinpatico!
rene
Agosto 26, 2007 a las 5:59 pm
Bueno hay que ser un poco realistas, es imposible por el momento realizar el efecto de lightbox sin un poco de javascript, aunque si bien es cierto que es casi un 80% de css y un 20 de js. Recordar que se debe invocar el id del elemento con el getElementById y crear el efecto fade. Muy buena informacion de cualquier manera… ;)
torka
Agosto 27, 2007 a las 9:57 pm
che, pero eso de 100% no tiene nada…. o_O
en ie no anda ni para atrás. :-X
igual se agradece.
saludos!
Infected-FX
Agosto 28, 2007 a las 1:18 am
@Alejandro Torres Si bro, apenas está como en etapa de desarrollo pero puede ser una buena opción.
@rene Estoy de acuerdo bro, además actualmente ya incluir librerías como mootools ó scriptaculous es muy común y vamos por unos kb más ese bonito efecto de lightbox vale la pena, pero solo es una alternativa.
@torka Cierto, en IE falla, lástima, pero como decía anteriormente, es solo una alternativa que se anda desarrollando :) habrá que esperar que se pueda fixear.
Fernando
Noviembre 8, 2007 a las 11:32 pm
Que tal?
Como puedo hacer el efecto de light box automaticamentre cuando carga la pagina, sin necesidad de hacer click