SimpleModal 1.3-b1 Released

SimpleModal 1.3 has been released

Considering the number of changes and new features, I've decided to release 1.3 as a beta version. This release covers most of the common requests I receive for SimpleModal: forced focus on the dialog (prevent tabbing away), ESC/overlay-click to close dialog and an appendTo option.

*NOTE*: Moving forward, all issue/bug/feature requests should be made on the issues page:


Complete list of changes and new features:

  • Added appendTo option, primarily for .NET users to enable appendTo('form')
  • Added focus option which forces focus to remain in the dialog
  • Added dataId option which allows a unique id to be set for the data div if one does not already exists
  • Added minHeight/minWidth options to allow minimum dimensions to be enforced
  • Added maxHeight/maxWidth options to allow maximum dimensions to be enforced. SimpleModal will always contain the modal dialog within the browser window.
  • Added escClose option to bind modal close to the ESC key
  • Added overlayClose option to bind modal close to a click on the overlay div
  • Added a wrapper div to allow for easier overflow capabilities
  • Changed meaning of close option. If false, the closeHTML, escClose and overlayClose values will be ignored.
  • Fixed auto-centering issues when container dimensions were not provided
  • Fixed Opera screen painting issues by adding .hide() before .remove()
  • Fixed Opera 9.2.x issue with jQuery 1.3.x and $(window).height()

Other than the close option, all previous options remained the same and the new options should be fairly self-explanatory.

Thanks for using SimpleModal!



  1. June 2, 2009 @ 12:48 pm #

    hi Eric, keep working bro... thx 4 new versions of SimpleModal

  2. June 5, 2009 @ 6:12 am #

    Great job !

    2 little corrections on your 1.3-b1 version would make it perfect.
    - Line 62, starting with a ';' makes the script easier to minify and concat with others :

    ;(function ($) {

    - Line 326, add e.preventDefault(); before calling close function

    else if ((self.opts.close && self.opts.escClose) && e.keyCode == 27) { // ESC

    In my case, a $.get in a onClose callback function was interrupted by propagation of event in case of close by ESC key whereas simple click in close box was ok. This patch corrects the trouble.

    Thanks for all, again.

  3. June 5, 2009 @ 2:57 pm #

    how do you activate overlayClose ?

  4. June 5, 2009 @ 8:25 pm #

    @Cedric - thanks for the code updates...I'll be sure to add them to 1.3!

    @Coop - you can either set it as a global default with:

    $.modal.defaults.overlayClose = true;

    Or as an option:

  5. June 22, 2009 @ 1:06 am #

    Hi Eric,

    Great job!

    Say, shouldn't 1.3 line 438 be:
    cw = this.getVal(this.dialog.container.css('width'))

    This will make my current code work with 1.3, else the container will always have the entire window's width.

  6. June 22, 2009 @ 8:41 am #

    @Scooper - are you seeing different results with that change? The only reason I had that for ch was due to browser differences determining height. If you have an example of how your suggestion fixes something, please let me know.

  7. June 27, 2009 @ 11:30 am #

    overlayClose doesnt seem to work for me in the final 1.3 release...ive never been able to get it to work in any release...

  8. July 5, 2009 @ 7:57 pm #

    Have you tried setting the overlayClose option to true?

  9. July 13, 2009 @ 3:02 pm #

    Is there a way to have this contact form send to different email address based on where it is activated within a site?

  10. July 26, 2009 @ 8:42 pm #

    Hi, I've used the smcf plugin here:
    (contact link in the footer)
    but I can't see a close link in the modal window, so there's no way to close the modal window once it pops up. What might be wrong? Thanks.

  11. July 30, 2009 @ 2:13 pm #


    it's a great plugin, thanks!

    I have a question : is there a way to use several modal at the same time?
    I need to use a Modal when another Modal is in use (a link in a modal open a new modal on top of the first).

    I have try the following code

    $.modal('<div>my data</div>', {});
    $.modal('<div>my data2</div>', {});

    but only the first Modal is create. So, is there a way to deal with my need.

  12. July 31, 2009 @ 7:50 pm #

    @Nico - currently, SimpleModal does not support multiple dialogs open at the same time. I've been getting enough requests that I'll consider adding it in a future version.

    @John - sure, but it would require some custom coding. If you like, you contact me via email to discuss it further.

    @Srijan - the cancel button closes the dialog.

  13. August 1, 2009 @ 10:56 pm #

    first of all, thank you for this plugin, great work.

    Is there a way to have "send me a copy" set up a default and if where I would have to make changes.

    Right now it has to be clicked by the sender.

    Thank you in advance

  14. August 2, 2009 @ 7:53 am #

    If you are using the WordPress plugin, you'll need to open smcf.php and modify the checkbox code to look like:

    <input type='checkbox' id='smcf-cc' name='cc' value='1' tabindex='1005' checked='checked'/>
  15. August 10, 2009 @ 6:02 am #

    Hey! it is a nice script.
    Has this script been released under LGPL??
    Can anyone use it for the commercial use also??

    Kindly confirm asap.
    Thanks :-)

  16. August 11, 2009 @ 6:52 am #

    @Ankit - the license terms are in included in the script. SimpleModal is released under the same terms as jQuery (dual licensed under the MIT and GPL licenses).

  17. October 26, 2009 @ 9:45 pm #

    Hi, Eric: Thanks your code. I use your plugin in to implement mvc

  18. December 24, 2009 @ 3:55 am #

    Hi, Eric.
    First thanks for that great plugin.
    Are you expecting to do it draggable? When I open the modal I do it in the centre. If the screen size is not enough high when I scroll down I can't see the buttons that the modal has in the bottom, any suggestion?

    Many thanks ;)

  19. December 24, 2009 @ 4:52 am #

    I've tried with jquery.ui draggable and it works. Just import ui.core, ui.draggable jquery scritps and make the containerId of your simplemodal draggable()!


  20. January 21, 2010 @ 3:33 am #

    Hi Eric - this is a great plugin thanks for creating and sharing it.

    I might be missing something obvious or it could well just be my HTML. I'm using the modal window for a terms and conditions 'popup' with a fairly lengthy amount of content, when the modal window shows it all scrolls well but starts right at the bottom of the content. Any ideas?

    Thanks in advance.

Leave a Comment

Sorry, comments are closed. You can contact me directly, if you like.

Eric Martin