I have a Fancybox with two buttons in it: Merge and Cancel. Cancel closes the fancybox and Merge posts a form and wait for the page to reload. It takes a couple of seconds for the page to reload so after the user has pressed Merge I disable the Cancel button and I would like to set the option modal
to true
but I can't seem to find a way to set an option on a already opened fancybox. Does anyone have any suggestion on how to do this?
Playground: http://jsfiddle.net/vCtVq/
There is no simple option to toggle "modal" state, fancyBox is either modal or not. But I can think of two solutions.
1) Hide close button and unbind click event on the overlay -
$('#merge').click(function() {
$('#cancel').attr("disabled", "disabled");
$('.fancybox-item').hide();
$('.fancybox-overlay').unbind();
console.log('submit');
});
Demo - http://jsfiddle.net/am8d3/
2) Create a global variable, and check it using "beforeClose" callback. You can cancel closing by returning "false" -
var busy = false;
$(".o").fancybox({
//modal: true
beforeClose: function() {
if (busy) {
return false;
}
}
});
Demo - http://jsfiddle.net/MLjAT/