Results 1 to 9 of 9

Thread: DHTML Window Position

  1. #1
    Join Date
    Jan 2005
    Location
    Texas, USA
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question DHTML Window Position

    I have utilized the DHTML code provided in the DHTML Window article at:

    http://www.dynamicdrive.com/dynamici...htmlwindow.htm

    I need know how to change the vertical position of the window that opens. The horizontal position is controlled by the line:

    document.getElementById("dwindow").style.left="30px"

    But the line that appears to control the vertical position I cannot make any sense of:

    document.getElementById("dwindow").style.top=ns6? window.pageYOffset*1+30+"px" : iecompattest().scrollTop*1+30+"px"

    How do you change the vertical position of the window that opens?

  2. #2
    Join Date
    Dec 2004
    Posts
    177
    Thanks
    0
    Thanked 18 Times in 17 Posts

    Default

    This:

    document.getElementById("dwindow").style.top=ns6? window.pageYOffset*1+30+"px" : iecompattest().scrollTop*1+30+"px"

    Is Basically

    If (ns6)
    window.PageYOffset*1+30+"px"
    else
    iecompattest().scrollTop*1+30+"px"

    The thirty is what you would change...

  3. #3
    Join Date
    Jan 2005
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    is it possible to set this value as a variable to be specified in the link (togheter with the width and height of the window)?

  4. #4
    Join Date
    Jun 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default A solution for DHTML Window?

    Hi,

    did you get a solution for the question:

    is it possible to set this value as a variable to be specified in the link (togheter with the width and height of the window)?

    If yes, please give it to me. I have the same problem for my website.

    Thanks,

    Andi.

  5. #5
    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

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script>
    
    //DHTML Window script- Copyright Dynamic Drive (http://www.dynamicdrive.com)
    //For full source code, documentation, and terms of usage,
    //Visit http://www.dynamicdrive.com/dynamicindex9/dhtmlwindow.htm
    
    var dragapproved=false
    var minrestore=0
    var initialwidth,initialheight,initialleft,initialtop
    var ie5=document.all&&document.getElementById
    var ns6=document.getElementById&&!document.all
    
    function iecompattest(){
    return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
    
    function drag_drop(e){
    if (ie5&&dragapproved&&event.button==1){
    document.getElementById("dwindow").style.left=tempx+event.clientX-offsetx+"px"
    document.getElementById("dwindow").style.top=tempy+event.clientY-offsety+"px"
    }
    else if (ns6&&dragapproved){
    document.getElementById("dwindow").style.left=tempx+e.clientX-offsetx+"px"
    document.getElementById("dwindow").style.top=tempy+e.clientY-offsety+"px"
    }
    }
    
    function initializedrag(e){
    offsetx=ie5? event.clientX : e.clientX
    offsety=ie5? event.clientY : e.clientY
    document.getElementById("dwindowcontent").style.display="none" //extra
    tempx=parseInt(document.getElementById("dwindow").style.left)
    tempy=parseInt(document.getElementById("dwindow").style.top)
    
    dragapproved=true
    document.getElementById("dwindow").onmousemove=drag_drop
    }
    
    function loadwindow(url,width,height,left,top){
    if (!ie5&&!ns6)
    window.open(url,"","width=width,height=height,scrollbars=1")
    else{
    document.getElementById("dwindow").style.display=''
    document.getElementById("dwindow").style.width=initialwidth=width+"px"
    document.getElementById("dwindow").style.height=initialheight=height+"px"
    document.getElementById("dwindow").style.left=left+"px"
    document.getElementById("dwindow").style.top=ns6? window.pageYOffset*1+top+"px" : iecompattest().scrollTop*1+top+"px"
    document.getElementById("cframe").src=url
    }
    }
    
    function maximize(){
    if (minrestore==0){
    minrestore=1 //maximize window
    initialleft=document.getElementById("dwindow").style.left;
    initialtop=document.getElementById("dwindow").style.top;
    document.getElementById("maxname").setAttribute("src","restore.gif")
    document.getElementById("dwindow").style.width=ns6? window.innerWidth-20+"px" : iecompattest().clientWidth+"px"
    document.getElementById("dwindow").style.height=ns6? window.innerHeight-20+"px" : iecompattest().clientHeight+"px"
    document.getElementById("dwindow").style.left=ns6? window.pageXOffset+"px" : iecompattest().scrollLeft+"px"
    document.getElementById("dwindow").style.top=ns6? window.pageYOffset+"px" : iecompattest().scrollTop+"px"
    }
    else{
    minrestore=0 //restore window
    document.getElementById("maxname").setAttribute("src","max.gif")
    document.getElementById("dwindow").style.width=initialwidth
    document.getElementById("dwindow").style.height=initialheight
    document.getElementById("dwindow").style.left=initialleft
    document.getElementById("dwindow").style.top=initialtop
    }
    }
    
    function closeit(){
    document.getElementById("dwindow").style.display="none"
    }
    
    function stopdrag(){
    dragapproved=false;
    document.getElementById("dwindow").onmousemove=null;
    document.getElementById("dwindowcontent").style.display="" //extra
    }
    
    </script>
    </head>
    <body>
    <div id="dwindow" style="position:absolute;background-color:#EBEBEB;cursor:hand;left:0px;top:0px;display:none" onMousedown="initializedrag(event)" onMouseup="stopdrag()" onSelectStart="return false">
    <div align="right" style="background-color:navy"><img src="max.gif" id="maxname" onClick="maximize()"><img src="close.gif" onClick="closeit()"></div>
    <div id="dwindowcontent" style="height:100%">
    <iframe id="cframe" src="" width=100% height=100%></iframe>
    </div>
    </div>
    
    <script>
    //Use below code to load DHTML Window as page loads 
    if (ns6) window.onload=new Function('loadwindow("http://www.google.com",600,400,100,150)')
    else
    loadwindow("http://www.google.com",600,400,100,150)
    </script>
    
    <!--Use below code to load DHTML window via link-->
    <a href="javascript:loadwindow('http://www.google.com',600,400,70,200)">Geocities</a>
    </body>
    </html>
    - John
    ________________________

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

  6. #6
    Join Date
    Jun 2005
    Posts
    63
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you John for this update to the script.

    Is it possible to modify the script further so that it is centered in the users browser?

    Or perhaps modify initialleft and initialtop so they can take other arguments like "left, center, right" and "top, middle, bottom", as well as pixel values?

    Or perhaps even allow combinations of the above terms and pixels so the user can add padding to the position from the start location?

    Thanks again,

    Thomas
    http://www.flyingscool.com
    or the new version of the site I am building, currently at
    http://www.flyingscool.com/index3.htm

  7. #7
    Join Date
    Jun 2006
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry

    Hi, im using the DHTML Window script and i am trying to launch the window from one of the links in the Microsoft Outlook Bar script

    I cant get the link to work, it just says that there is a syntax error, but i cant find where it is.

    P.s. I haven't modified the javascript in either script, just incase you put it down to that.

    Thanks for your help in advance.

  8. #8
    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

    Quote Originally Posted by cbulmer
    Hi, im using the DHTML Window script and i am trying to launch the window from one of the links in the Microsoft Outlook Bar script

    I cant get the link to work, it just says that there is a syntax error, but i cant find where it is.

    P.s. I haven't modified the javascript in either script, just incase you put it down to that.

    Thanks for your help in advance.
    These two scripts are not well suited to working together. Outbar uses a frameset, while DHTML Window is meant for installation on a single page. In an unrelated matter, Outbar will only work in IE so, in my opinion, isn't the best choice for the internet which now has 20 to 30 percent of its users browsing in other browsers. When Outbar was written, this was more like less than 10%.

    The syntax error you are seeing is probably just the result of entering the command for DHTML Window into folders.js in an invalid manner. Also, it would have to be targeted to the frame you wanted it to appear in somehow (this part would be the trickiest). However, even if written correctly and targeted, the DHTML Window would have to be in one frame or the other. This would limit its scope of visibility to that frame. If it didn't entirely fit within that frame, it would be partly cut off. If you wanted it available to more than one of the pages that Outbar brings up, it would have to be on or linked to each page. If not, it would need to be prevented from firing unless the desired page were already loaded.

    Unless you are certain that unique aspects of your intended application of these two scripts together makes all of the above considerations unimportant, my best advice would be to find another way way to deal with your content.
    - John
    ________________________

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

  9. #9
    Join Date
    Jun 2006
    Posts
    15
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Post

    Hi, the combination of the scripts is not for a website, but a html application that i am developing. There is no frameset, I managed to work around that. What I did was use the page that the menu was on, then placed an iframe to the right hand side of it, therefore removing the frameset.

    I need the iframe there because when i maximize the dhtml window, it would cover the menu otherwise.

    It doesn't matter that it only works in IE because HTML Applications depend on IE and not, let's say firefox or netscape.

    The frame that i have used is called 'content', without the quotes.

    Thanks for your help in advance.

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
  •