Is it possible to trigger an event on clicking the close button of jquery lightbox

Question

I am using the Jquery LightBox plugin. It works fine. I need an dialog box to be opened once i click the close button of the Jquery LightBox. But i couldn do so...Is that possible to track the close event of lightbox and trigger another event?

Please help

Answer 1

Replace _finish function in jquery-lightbox-0.5.js with below code:

function _finish() {
    $('#jquery-lightbox').remove();
    $('#jquery-overlay').fadeOut(function() { $('#jquery-overlay').remove(); });
    // Show some elements to avoid conflict with overlay in IE. These elements appear above the overlay.
    $('embed, object, select').css({ 'visibility' : 'visible' });

    var callback = settings.onClose;
    if($.isFunction(callback)) {
         callback.call();
    }
}

Add onClose in settings at top in jquery-lightbox-0.5.js file after activeImage;

// Don´t alter these variables in any way
imageArray: [],
activeImage: 0,         
onClose: null

Usage :

$('#gallery a').lightBox({ onClose : function() { alert('Hi'); }  } );

Answer 2

From the source

$('#lightbox-loading-link,#lightbox-secNav-btnClose').click(function() {
    _finish();
    return false;
});

So just add an event handler to #lightbox-secNav-btnClose and it should work

$("body").on("click", "#lightbox-secNav-btnClose", function() {
    console.log("lightbox closed");
});

Answer 3

From personal experience I can recommend you to use Colorbox

There you have onClosed property on the init of the colorbox so it's easy as:

$("a.lightbox").colorbox({
    onClosed: function() {
        console.log('closed')
    }
});

Answer 4

This worked for me without modifying anything in lightbox.js:

<div onclick="close_lightbox()">Close Button</div>

function close_lightbox()
{
    lightbox.end();
}