SummArg | Cursos y recursos para webmasters

06/07/2011

Lightly, un lightbox basado en jQuery y CSS3

Lightly es un plugin jQuery sumamente sencillo que utiliza CSS3 logrando un fabuloso efecto en la mayoría de los navegadores salvo en IE7 e inferiores. Su integración a proyectos es muy simple. Primero descargamos los archivos y hacemos las correspondientes llamadas desde la sección <head> de nuestro documento.
<link rel="stylesheet" href="lightly.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="jquery.lightly.js"></script>

Luego indicamos con que clase se activará y colocamos valores para el color de fondo y su opacidad al ser activado.
<script>
$(document).ready(function() {
$('.lightly').lightly({
'backgroundColor':'0,0,0',
'backgroundOpacity':'0.4'
});
});
</script>

Finalmente aplicamos la clase a una imagen.
<a href="image.png" class="lightly">Example</a>
Descargar Lightly | Visto en kabytes

Dejar un comentario