SimpleModal resizing the container

Just do this....

$("#simplemodal-container").css('height', 'auto'); //To reset the container.$(window).trigger('resize.simplemodal');           //To refresh the modal dialog.

I'd like to suggest a simpler and more flexible solution:

Visit http://www.ericmmartin.com/simplemodal-test/, run the following code in Firebug and then click on "button" in the dialog to resize it.

// Inject a CSS class into the document$('head style[type=text/css]').append('.wide{width:750px !important;}');$('#modalContentTest').modal({  onShow:function(dialog){    dialog.data.find('.animate').click(function(){      // You can put this code in your "my.php" callback      dialog.container.addClass('wide');      /*      // OR set the width explicitly      // (make sure you remove the addClass line if you want to use this)      dialog.container.width(700);      */      /*        Force SimpleModal to reposition the         dialog by triggering its resize event      */      $(window).trigger('resize.simplemodal');    }); //end click  } // end onShow}); // end modal

With this method you don't have to define new CSS to re-center the dialog and you can let SimpleModal take care of browser inconsistencies.

You can do it by adding and removing classes for the modalContainer element.

Fog Creek Copilot uses SimpleModal, with two sizes, normal and wide. If you go Copilot and click 'Log In', you'll see the normal size. Now, put into Firebug's console

>> $('.modalContainer').addClass('wide')

You should see the container get wider. All you have to do to make this work on your site is define classes for all the sizes you want, and add and remove them dynamically.