simple modal - calling modal when another modal is present?

Question

I am using Simple Modal and I have it working perfectly except for one thing.

I can't work out how to handle cases where the modal is already visible and another modal is called.

What I want is something like shadowbox where it will resize the box to the size of the new content. Although if not possible I will settle with the box disappearing and the new one appearing.

How would I do this?

This is my current code

//show/hide animations
$.extend($.modal.defaults, {
    onOpen: function (dialog) {
        dialog.overlay.fadeIn('fast', function () {
            dialog.data.show();
            dialog.container.show('slide', {direction: 'down'}, 'medium');
        });
    },
    onClose: function (dialog) {
        dialog.container.hide('slide', {direction: 'up'}, 'medium', function () {
            dialog.overlay.fadeOut('fast', function () {
                $.modal.close();
            });
        });
    }
});

//triggers 
$('#subscribe_form').modal({
  minWidth: 860,
  minHeight: 390
});

//this link is both inside the subscribe_form modal, and on a menu bar
$('.login_link').live('click', function() {
  $('#login_dialog').modal();
});

Answer 1

This doesn't seem like the greatest solution, but you could try:

http://jsfiddle.net/Xwn3G/

$('.login_link').live('click', function() {
    setTimeout(function(){$('#login_dialog').modal();}, 1500);
    $.modal.close();
});

From what I can tell, the call to the show the new modal has to follow the completion of the model close; or, it's canceling the events of the elements within the model html onClose. I was also able to get it to work with 1000 milliseconds, but that will probably depend on the user's browser.