glassbox.jpg

Glassbox compacto Javascript que pretende ser una solución simple para crear bordes transparentes y diseños coloridos. Es fácil de usar, y probado bajo IE 6, Firefox, Opera 2,0 y 9,1. Necesita de Prototype y Script.aculo.us para los efectos.

Enlace Glassbox - Descarga

Demos

Ejemplo Simple: GlassBox
Ejemplo en Lightbox: Lightbox-gone-glass
Uso
Descomprimir GlassBox.zip. Incluir la llamada al script GlassBox desde nuestra cabecera. Dentro de la etiqueta < head >.

PLAIN TEXT
JavaScript:
<script src="glassbox/glassbox.js" type="text/javascript"></script>

Recodar también agregar la llamada a prototype y scriptaculous. Se incluye con el paquete Zip.

PLAIN TEXT
JavaScript:
<script src="../javascripts/prototype.js" type="text/javascript"></script>
<script src="../javascripts/scriptaculous/effects.js" type="text/javascript"></script>

Crear un nuevo objeto y definir en la 5ta línea (myGlassBox.init) el “id” de inicio (Div donde usaremos GlassBox), anchura, altura y bordes.
En la Línea 6 (myGlassBox.apos), definir posición de la izquierda y de arriba (ver API DOC).

PLAIN TEXT
JavaScript:
<script type="text/javascript">
window.onload = function(){
    path_to_root_dir = "../";
    var myBox = new GlassBox();
    myBox.init( 'myBox', '135px', '60px', 'hidden' );
    myBox.apos( '170px', '150px' );
};
</script>

Por ultimo, poner el contenido de tu GlassBox en un div.

PLAIN TEXT
HTML:
<div id="myBox">Hello, World!</div>

Gracias Maximiliano