¿Cómo manejo globalmente el evento Cerrar de fancybox?

Question

Estoy usando Fancybox en mi aplicación. Ahora para controlar el evento cerca escribimos algo como:

$(".fancybox").fancybox({onClose:function(){alert('blah');}} 

como se ve en esta página doc:

http://fancyapps.com/fancybox/#docs

Sin embargo, quiero escribir algo común y global a todos FancyBox que obtiene cada vez que ejecute para cualquiera de los fancybox. ¿Cómo puedo hacer eso? En resumen, no quiero escribir el código de onClose en cada fancybox y no quiero que dependa de la clase, id (por ejemplo, .fancybox en este caso). ¿Cómo puedo hacer eso? Traté de escribir:

$.fancybox({onClose:function(){alert('blah');}} 

pero no funciona y de los documentos que tiene este aspecto es la función de apertura progammatically.

Answer 1

No estoy seguro de si esta es la mejor solución pero me gustaría un diseño de pub/sub así que, en su fancybox debería hacer algo como eso.

$(".fancybox").fancybox(
{ onClose:function(){ 
       $(window).trigger('fancyboxClosed'); 
      } 
}); 

Entonces, en algún lugar de su código:

$(window).on('fancyboxClosed', function(){ 
    // Your global function for fancybox closed 
}); 

no sé mucho acerca de su propósito, pero tener en cuenta que siempre se puede pasar a una función llamada en lugar de un anónimo por lo que siempre activar la misma función.

El ejemplo anterior debería ser el camino a seguir si desea hacer diferentes cosas dependiendo de cada caja de lujo.

Además, puede adjuntar el evento al objeto que desee. Solo usé la ventana para mayor comodidad.

Editar

También puede editar su fuente FancyBox para hacer eso (para editar 1.3.4) sólo tiene que añadir a $(window).trigger('fancyboxClosed'); alrededor de la línea 953.

Answer 2

Por lo que veo, FancyBox no está proporcionando cualquier API para eso. En su lugar, puede utilizar un truco. La luz se cierra cuando:

1. se hace clic en el botón de cierre (div con la clase 'FancyBox de cerca') se hace clic en
2. fondo negro (div con la clase 'FancyBox-overlay')
3. botón de escape es presionado (e.which = 27)

Entonces, puede agregar un manejador de clics al cuerpo para verificar si event.target es .fancybox-close o .fancybox-overlay. También agregue un manejador de teclas para documentar para escuchar si se presiona la tecla de escape.

Answer 3

Intente utilizar métodos

BeforeClose o afterClose

trabajo

Este código fina

$(".fancybox").fancybox({beforeClose:function(){alert('blah');}} 

Answer 4

Aquí es una solución decente para 1.3.4

$(document).delegate('#fancybox-close,#fancybox-overlay','click',function(){ 
    FancyBoxClosed(); 
}); 
$(document).keyup(function(e){ 
    if(e.keyCode == 27){ 
     if($('#fancybox-overlay').css('display') != 'none') 
      FancyBoxClosed(); 
    } 
}); 

function FancyBoxClosed() 
{ 
    //global callback for fancybox closed 
} 

Para una versión distinta a la 1.3.4, compruebe dos veces los selectores del elemento de fantasía para la plantilla y cierre el botón con libélula, luciérnaga u otra.