Blog del Leo

A lo mejor no es un problema muy popular pero de que me costo encontrar la solución, me costo… Asi que decidi ponerla en el blog, primero para que no se me olvide y segundo para compartirla con quienes leen y siguien este blog.

Ubiquemonos en el contexto del problema.

Queremos poner un ModalPopUpExtender sobre un objeto Flash en nuestra pagina web, este ModalPopUp aparecera en ocasiones dada un cierta lógica.

Problema.

ModalPopUpExtender se ubica detras del objeto Flash, no teniendo opciones de manipular nuestro popUp.

Solución.

La solución que encontramos nos la da nuestro buen amigo javascript y algunos arreglos a nuestro html, solución probada en Firefox e Internet Explorer.

• Objeto Flash:

  El objeto Flash que está destacado en amarillo, tenemos que asignar las propiedades wmode en opaque tanto en el tag param como en el tag embed, además, tenemos que tener a nuestro objeto en dentro de un div y debemos colocarle un id, ya que lo invocaremos desde javascript.

  1 2 3 4 5 6 7 8 9 10

  <div id="flashObject> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,42,0" id="presentacion_blanco_10" width="990px" height="400"> <param name="movie" value="img/presentacion_blanco_19.swf" /> <param name="quality" value="high" /> <param name="bgcolor" value="#FFFFFF" /> <param name="wmode" value="opaque" /> <embed name="presentacion_blanco_10" src="img/presentacion_blanco_19.swf" quality="high"  wmode="opaque" bgcolor="#FFFFFF" swliveconnect="true" width="990px" height="400" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object> </div>

• ModalPopUpExtender

  La caracteristica importante que hay que tener preparada en el ModalPopUpExtender es BehaviorID ya que con ese nombre(ID) es con cual se puede invocar al ModalPopUpExtender desde Javascript.

  1 2 3 4 5 6

  <cc1:ModalPopupExtender ID="PopUpEjemplo" runat="server" TargetControlID="label" BehaviorID="PopUpEjemplo" PopupControlID="seleccionSubrogancia" PopupDragHandleControlID="panelDragHandle" BackgroundCssClass="popUpStyle">

• Javascript

  Ahora en nuestro código Javascript crearemos una función la cual esconda nuestro objeto flash para poder colocar sobrepuesto el ModalPopUpExtender cuando sea invocado.

  1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

  function pageLoad(sender, e) { var popup = $find("PopUpEjemplo"); popup.add_shown(noVisible); // En la propiedad add_show(muestra popUp),ocultamos el objeto Flash popup.add_hidden(Visible); }// En la propiedad add_hidden(oculta popUp), mostramos el objeto Flash   function noVisible(ev) { objFlash = document.getElementById('flashObject'); objFlash.style.display = 'none'; }   function Visible(ev) { objFlash = document.getElementById('flashObject'); objFlash.style.display = 'block'; }

  Con todo estos simples pasos podemos trabajar con objetos Flash y ModalPopUpExtender sin ningun problema.

  Espero les sirva.

  Compartir:

  • 
  • 
  • 
  • 
  •