SexyLightbox: Como cerrar una ventana modal desde un iFrame usando jQuery 10

Las ventanas modales (Lightbox), son muy útiles si alguien quiere mostrar o destacar algún tipo de información en un sitio web, puesto que permiten no perder la atención de la ventana original y no hay necesidad de abrir una ventana nueva (con el riesgo de ser bloqueada por algún bloqueador de pop-ups  (hay que tener en cuenta la forma correcta de lanzar o abrir un pop up en el explorador de nuestro visitante).

Actualmente hay muchos scripts que permiten abrir estas ventanas modales (window modal) o Lightbox, uno de ellos es SexyLightbox, un código muy interesando además de vistoso que tiene versiones en Moo y en jQuery.

Hace poco tuvimos un problema en el trabajo mientras intentábamos controlar el cierre desde una pagina dentro de esta ventana modal.
La solución, luego de algo de investigación es que dentro de la web que abriremos se crea una función por ejemplo:

function fcnClose()
{
alert("Se va a cerrar SexyLightbox");
// Función necesaria para cerrar la ventana modal
window.parent.SexyLightbox.close();
// Función necesaria para actualizar la ventana padre
window.parent.document.location.reload();
}

De esta forma se puede llamar dentro de esta manera:
<a href="javascript:fcnClose();">Cerrar</a>
Básicamente la magia esta en la propiedad window.parent este objeto nos permite acceder al DOM de la ventana papá que es donde esta declarado el objeto SexyLightbox.

10 thoughts on “SexyLightbox: Como cerrar una ventana modal desde un iFrame usando jQuery

  1. Reply cucho Jul 8,2010 10:45 pm

    muchas gracias por tu post me salvo el proyecto

  2. Reply Cavalheiro Aug 3,2010 1:13 am

    muy buen post CJ

  3. Reply jaider Sep 15,2010 10:09 am

    Excelente era lo que esta buscando

  4. Reply Rodrigo Jan 10,2011 9:07 am

    Muhas gracias me has salvado. Llevaba 2 semanas pillado en esto.

  5. Reply Sergio Jan 27,2011 3:09 am

    5 am de la mañana.. por fin di con tu pagina y la solución, a mi problema gracias por tu aporte

  6. Reply Fede Jul 11,2011 4:43 pm

    Excelente! Gracias! Me salvaste tiempo de investigación!

  7. Reply malc Jul 3,2012 9:16 pm

    En realidad la ventana no se cierra con la instrucción window.parent.SexyLightbox.close();
    Lo que pasa es que al refrescar el browser con la función window.parent.document.location.reload(); se va la ventana, en caso de tener información en la pagina principal esta se pierde.

  8. Reply cesar vasquez Jan 8,2013 4:20 am

    esto me sirvio ami en el uso de iframes
    parent.location.reload();

  9. Reply Yosved Villar lopez Jan 15,2013 4:16 pm

    Hola que tal, el metodo cerrar sexylightbox me funciona perfectamente. Ahora lo que quiero es otro boton que redirecciona la ventana padre a otra pagina.

    espero su pronta respuesta.

  10. Reply David Jan 2,2015 8:48 pm

    Que buen posteo !! Cómo funcionaría en caso de trabajar con LightWindow ??

Leave a Reply