Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New to the CF scene
    Join Date
    Jul 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    showModelessDialog AND "modal" attribute

    I have been struggling with this for a few days now and was hoping somebody had some advice. I have my webpage up now, and the problem I am having is that I have a javascript that opens a new window. This all works fine, but the problem I am running into is that when the user clicks on the thumnail, the new window opens (this works fine) but when the user clicks on another thumbnail, the window goes behind the main window. This causes the user to get lost in the site, not knowing where the new gallery window is located. So I am trying to figure out how to keep the new window on top of the main window.

    Here is an example:
    http://www.pridenutrition.com/ArnoldClassic2005.aspx


    So what I have figured out is how to make this method work in IE. Using the showModelessDialog method.

    Here is an example:
    http://www.pridenutrition.com/TESTsh...essDialog.html
    (if you click the "Click Here For Nutritional Information" link, open the window, and then click back to the main window, the showModelessDialog works by staying on top of the main window)
    (This only works in Internet Explorer)

    I have also gotton a separate way to work but it only works in Firefox. I used the attribute with a "onClick="window.open()", (at the end) 'modal=yes'.

    Here is that example:
    http://www.pridenutrition.com/TESTModal.html
    (It works the same as above)
    (but it only works in firefox, NOT IE)

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,966
    Thanks
    0
    Thanked 236 Times in 233 Posts
    Just set focus the new window.
    Code:
    onClick="win=window.open('EventGalleries/ArnoldClassic2005/Photo01.aspx', 'newWin', 'width=600, height=510, toolbar=0, directories=0, status=0, scrollbars=0, resizable=0, menubar=0'); win.focus();"
    You can put the code in the function so that you won't need to call window.open with that long parameters.
    Code:
    function doOpen(url, target, w, h){
       var win = window.open(url, target, 'width='+w+', height='+h+', toolbar=0, directories=0, status=0, scrollbars=0, resizable=0, menubar=0');
       if (win) win.focus();
       return false; //cancel href action if called by link
    }
    ...
    onClick="doOpen('EventGalleries/ArnoldClassic2005/Photo01.aspx', 'newWin', 600, 510)"
    onClick="doOpen('EventGalleries/ArnoldClassic2005/Photo02.aspx', 'newWin', 600, 495)"
    onClick="doOpen('EventGalleries/ArnoldClassic2005/Photo03.aspx', 'newWin', 600, 495)"

  • #3
    New to the CF scene
    Join Date
    Jul 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    When I do that the window still goes behind the main window.

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,966
    Thanks
    0
    Thanked 236 Times in 233 Posts
    Can you update the link with your changes so that I can see it for myself?

  • #5
    New to the CF scene
    Join Date
    Jul 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here are the changes I made. The window still goes behind the Main window, which is what I am trying to avoid.

    http://www.pridenutrition.com/TESTModal3.html

  • #6
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,966
    Thanks
    0
    Thanked 236 Times in 233 Posts
    It works for me in Firefox and IE. The window is activated everytime the link is clicked even when it is minimized before the link is clicked. What browser are you using?

  • #7
    New to the CF scene
    Join Date
    Jul 2006
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The window does always open, but what i want it to do is 1)click on the link 2)after thw window is open, click back on the main window (in which you clicked to open the link) 3)when you click back to the main window, the modal window should stay in front.

    http://www.pridenutrition.com/TESTModal3.html

  • #8
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    10,966
    Thanks
    0
    Thanked 236 Times in 233 Posts
    So you are forcing the user to close the popup window first. IMO, that's not a good way to display images. But if you like it that way, you just combine your IE and Firefox code using object detection.
    Code:
    if (showModelessDialog){ //IE
      var w=showModelessDialog(url, "", "...");
    }
    else { //other browsers
      var w=window.open(url, "newWin", "modal=1, width=500, height=400");
      w.focus();
    }

  • #9
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,471
    Thanks
    0
    Thanked 634 Times in 624 Posts
    See http://javascript.about.com/library/blmodald1.htm for a way to do modal dialog boxes with Javascript. The whole thing has to be in one page in order to work as most browsers don't provide a modal window option and the only modal options that exist across all browsers are alert(), confirm() and prompt().
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.


  •  

    Posting Permissions

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