Results 1 to 8 of 8

Thread: Popup from Iframe to Position in Parent window not working

  1. #1
    Join Date
    Sep 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Popup from Iframe to Position in Parent window not working

    1) Script Title:
    Dyanmic DHTML Popup Window

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

    3) Describe problem:

    Code:
    function openmypage(){
            recipebox=parent.window.dhtmlwindow.open('recipebox', 'iframe', 'windowfiles/external.htm', '#3: Ajax Win Title', 'width=500px,height=300px,left=100px,top=500px')
            var anchorelement=document.getElementById("videoproducts")
            recipebox.moveTo(dhtmlwindow.getposOffset(anchorelement, "left"), dhtmlwindow.getposOffset(anchorelement, "top"))
        }

    What I am trying to do is there is a link in an iframe of a window, and I would like it to display the popup window in the parent window, which I have done.

    The second thing I am trying to do is place it in a position relative to a div that is in the parent page, when I try to do that the page that should be remaining in the iframe expands to the whole page.

    Any Ideas on how to make this work properly?

  2. #2
    Join Date
    Sep 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Fixed the problem with the iframe breaking... new problem now

    The window is popping up and appearing in the right spot INITIALLY

    but if I scroll down a bit from the top of the page and click the link again the box goes with it.

    I need it to stay at the spot that the element is at so it pops up the same distance away from the top and left parts of an element and not the distance away from the top and left of the window

    Here is what I got

    Code:
        function openmypage(){
            recipebox=parent.window.dhtmlwindow.open('recipebox', 'iframe', 'windowfiles/external.htm', '#3: Ajax Win Title', 'width=500px,height=300px,left=100px,top=500px')
            var anchorelement=parent.document.getElementById("videoproducts")
            recipebox.moveTo(anchorelement.offsetLeft, anchorelement.offsetTop)
        }
    Last edited by mfeola; 09-23-2008 at 09:07 PM. Reason: New problem, same code

  3. #3
    Join Date
    Aug 2004
    Posts
    9,918
    Thanks
    3
    Thanked 969 Times in 957 Posts
    Blog Entries
    15

    Default

    There's been a few threads on how to position the DHTML window relative to some element on the page. For example, please see my response in this thread: http://www.dynamicdrive.com/forums/s...ad.php?t=25050
    DD Admin

  4. #4
    Join Date
    Sep 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I have tried much of the code in that post before I posted my question, I was unable to get it to do what I wanted.

    I need the window to appear from an iframe to a specific point of a div in the parent window all the time no matter where the window itself is scrolled to at the time.

    I have reviewed the comments in the post and the persons final solution (make the window pop up next to the mouse) will not work for me because it will still make the window position change depending on where the mouse is and there is an image that is clicked on that creates the popup so there is a lot of room for different positions that I do not want.

    Not to mention the code seems to be not working at all in IE

    The code I have gotten from that post has only gotten the window to appear where the div is positioned if the page is scrolled all the way at the top of the page. If the page is scrolled at the bottom of the page and the button is clicked it causes the page to expand as well as position the window in a different spot in the content and I don't want it to do that.

  5. #5
    Join Date
    Sep 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I should also mention that the site is aligned centrally so that when you resize the window from the left and the right the page content usually shifts around as well

    I was able to put an 'onresize' attribute to the body tag of the page to make it update the position of the window but it still doesn't always put it in the same place

  6. #6
    Join Date
    Aug 2004
    Posts
    9,918
    Thanks
    3
    Thanked 969 Times in 957 Posts
    Blog Entries
    15

    Default

    Do you have a link to the problem page? If so, please be detailed in exactly where on the page you're trying to position the DHTML window relative to.
    DD Admin

  7. #7
    Join Date
    Sep 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Sorry but this is a website that is still in development and is not available publicly right now.

    I understand that any help you can give is limited by this but I hope my explanations were thorough enough

  8. #8
    Join Date
    Sep 2008
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    But... the strangest thing...

    In the google chrome browser, the popup works perfectly

    In firefox, the only problem is that it doesnt move correctly when the page is stretched from side to side

    In IE, the popup does not move away from the top left corner... ever...

    Code to bring up the window in the iframe
    Code:
            recipebox=parent.window.dhtmlwindow.open('recipebox', 'ajax', 'windowfiles/external3.html?recipeID=33', '', 'width=520px,height=570px,left=100px,top=500px')
            var anchorelement=parent.document.getElementById("videolist")
            recipebox.moveTo(anchorelement.offsetLeft, anchorelement.offsetTop)
    Code to reposition it in the parent window
    Code:
    <script type="text/javascript">
        function resizepopup()
        {
            var anchorelement=document.getElementById("videolist")
            recipebox.moveTo(anchorelement.offsetLeft, anchorelement.offsetTop)
        }
    </script>
    Code I had to change in the javascript to make the move to work for scrolling up and down
    Code:
    moveTo:function(t, x, y){ //move window. Position includes current viewpoint of document
    	this.getviewpoint() //Get current viewpoint numbers
    	t.style.left=(x=="middle")? this.scroll_left+(this.docwidth-t.offsetWidth)/2+"px" : this.scroll_left+parseInt(x)+"px"
    	t.style.top=(y=="middle")? this.scroll_top+(this.docheight-t.offsetHeight)/2+"px" : parseInt(y)+"px"

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
  •