Problema:
Hay un objeto flash que debe funcionar como un botón que abra una ventana html flotante.
Solución:
Para abrir una ventana html flotante usaría window.open().
Encuentro que no es posible asociar a un objeto flash (definido con el tag object),un evento onclick.
Se me ocurre que podría cubrir el objeto flash con un bloque html de las mismas dimensiones al que si pudiera asociar un evento onclick.
Para eso, me baso en un patrón que aparece en
Pro CSS and HTML Design Patterns, de Michael Bowers.
Consiste en posicionar absolutamente un div dentro de otro.
Hago que el div banner_container contenga al objeto flash, pero también al div banner_overlay, que lo cubrirá:
<div id="banner_container">
<div id="banner_overlay">
</div>
<object...>...</object>
</div>
La clave está en hacer que banner_container tenga position:relative y banner_overlay tenga position:absolute. Además, ambos deben tener las mismas dimensiones del objeto flash, para que lo cubran exactamente.
#banner_container {
position: relative;
width: 200px;
height: 100px;
}
#banner_overlay {
position: absolute;
width: 200px;
height: 100px;
border: 1px solid #abe;
}
Luego, se puede usar javascript sobre el div banner_overlay. Por ejemplo, con jquery:
$(document).ready(function() {
$('#banner_overlay').click(function() {
var w = window.open('ventana1.html', 'Ventana 1', 'width=400,height=300');
});
});
Puede encontrar un demo
aquí.
