Hace tiempo encontré este ejemplo en la página de clipdepelicula , con el cual podemos abrir una imagen desde Flash por medio del ya famoso efecto Lightbox, lo único que se tiene que hacer es poner este código entre las etiquetas head:
<script type=»text/javascript»>
function LightboxDelegate(url,caption) {
var objLink = document.createElement(‘a’);
objLink.setAttribute(‘rel’,’lightbox’);
objLink.setAttribute(‘title’,caption);
Lightbox.prototype.start(objLink);
}
</script>
…y en las acciones del botón flash que abrirá la imagen colocar este código, soy consiente que desde la versión de Flash 8 se prohibió el uso de javascript desde los botones, pero bueno a alguien le puede ayudar:
on (release){
getURL(«javascript:LightboxDelegate(‘images/image-1.jpg’,’caption1′)»)
}
Básicamente lo que hace el codigo es mandar a llamar a la función LightboxDelegate y pasarle los parametros de la dirección donde se encuentran las imagenes y el titulo descriptivo de esa imagen.
Algo que le falto mencionar a clip de pelicula en este ejemplo, es el problema que surge, cuando lo utilizamos en conjunto con un SWF: esta película suele ponerse adelante del Lightbox, y no deja visualizar bien la imagen o el contenido que estamos desplegando.
Para eso me puse a investigar un poco y encontre la solución en la página de
csslab , donde dan una solución muy sencilla.
Para solucionar esto, se deben hacer 2 cambios: uno en el OBJECT que llama el SWF y uno en el CSS del contenedor de este SWF; en el caso de no tenerlo, es preferible crear un DIV que sólo contenga nuestra película Flash.
1.- En el OBJECT debemos aplicar un parámetro y un valor para la película Flash: wmode=»opaque».( Con opaque, la película Flash se esconderá detrás de cualquier elemento, sea éste HTML o controlado por Javascript.)
<object classid=»clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ codebase=»http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0″ width=»300″ height=»200″>
<param name=»movie» value=»csslab.swf» />
<param name=»quality» value=»high» />
<param name=»wmode» value=»opaque» />
<embed src=»csslab.swf» width=»300″ height=»200″ quality=»high» pluginspage=»http://www.macromedia.com/go/getflashplayer» type=»application/x-shockwave-flash» wmode=»opaque»></embed>
</object>
2.-Crear un DIV que contiene nuestra película Flash. Este DIV contendrá, en este caso, un z-index=-999; (Para quienes no conocen, la propiedad z-index determina el orden, o relevancia en que un elemento designado tendrá sobre otro.)
El CSS del DIV contenedor del SWF sería:
#flash {
z-index: -999;
}
Y listo, con esto tendremos arreglado todo nuestro problema que nos pudiese causar el Lightbox, les dejo el ejemplo ya arreglado con estos tips.
trace( «hasta la próxima»);