Pownce: No public Pownce messages.

Agrega tu enlace

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

Crear el efecto de lightbox solo con CSS

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.

Visitar enlace

Otras entradas relacionadas


2 Trackbacks a este post

  1. meneame.net
    Agosto 27, 2007 a las 03:29 pm
  2. Super sitio
    Noviembre 10, 2007 a las 09:39 pm

6 comentarios

  1. Alejandro Torres
    Agosto 26, 2007 a las 10:21 am

    Muy bueno infectedfx, ya hacia falta algo asi sin tener que usar javascript :P

  2. wydblog
    Agosto 26, 2007 a las 2:36 pm

    jaaja sinpatico!

  3. 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… ;)

  4. 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!

  5. 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.

  6. 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

Agregar comentario

*

*

XHTML: Puedes usar los siguientes tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Aumentar ↓ | Disminuir ↑

Sindica este sitio usando RSS

Recuerda que si quieres mantenerte informado y recibir nuestras actualizaciones agrega nuestro feed a tu lector favorito y podrás darle seguimiento a nuestro sitio.