Results 1 to 5 of 5

Thread: Close modal when click on background

  1. #1
    Join Date
    Mar 2007
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default Close modal when click on background

    1) Script Title:
    DHTML Modal window v1.1

    2) Script URL (on DD):
    http://www.dynamicdrive.com/dynamici...dhtmlmodal.htm

    3) Describe problem:
    Is it possible to close a modal when clicking on the veil/background? I have tried these with no success:
    A) document.write('<div id="interVeil" onclick="window.close()"></div>')
    B) document.write('<div id="interVeil" onclick="self.close()"></div>')

    BTW: Do you plan any update on the script? It would be cool if modal window in future will have fade-in when opened and fade out when closed

    Best regards
    Thomas

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Here is a typical command to allow what you want:

    Code:
    document.getElementById('interVeil').onclick = function(){
    agreewin.hide(document.getElementById('agreebox'), true);
    };
    It should follow the declaration (example below), where agreewin is the variable name to which the instance of dhtmlwindow was assigned and agreebox the id assigned for the the window that would be opened:

    Code:
    var agreewin=dhtmlmodal.open("agreebox", "iframe", "modalfiles/agreement.htm", "This Page's Terms of service", "width=590px,height=450px,center=1,resize=1,scrolling=0", "recal")
    Notes: If you have an onclose defined for the dhtmlwindow, if it returns false, it will prevent the above from working. Also, if you have more than one dhtmlwindow, things could get a bit messed up, but a more complex command could probably be devised to handle that.

    As to your second question, I'm pretty sure that will be coming, but cannot say for sure.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Mar 2007
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Thank you John for reply. I will have a lot of dhtml-modals with dynamic assigned ID's from posts in a database. I use dhtml-modals to show additional info, videos, linked pages, etc. for each post returned by the database. I think the solution will be too complex to achieve (for me) so I will go with the default modal-script.

    A bit off-topic: Do you know how to make the modal not-draggable and is it possible to assign a key-shortcut like cmd+x or esc to close the modal?

    Again: Thank you for your time - it is much appreciated.

    Best regards
    Thomas

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Well, it sounds to me like you might want Lightwindow:

    http://www.stickmanlabs.com/lightwindow/

    It would be a bit of a change, but it appears to have all of the functionality you want, including both clicking on the overlay to close and a fade in/out of the overlay. It's also very flexible - it can be invoked from a link with certain attributes or directly from javascript call as part of other code.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Mar 2007
    Posts
    6
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Hello John,

    Thanks again. I try the Lightwindow.

    Best regards
    Thomas

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •