Results 1 to 3 of 3

Thread: To move pop-up div window

  1. #1
    Join Date
    Apr 2008
    Posts
    14

    To move pop-up div window

    Hi,

    To move pop-up div window
    I am a beginner with web development & I want to move a Div pop up windows.
    Is there any one to help me or push me in right direction to code this?

    Thanks in advance.

  2. #2
    Join Date
    Oct 2008
    Posts
    31

    Re: To move pop-up div window

    Try this:

    Code:
    <HTML>
    <HEAD>
    <TITLE>Popup Dragable Div</TITLE>
    
    <style>
    /*intially hide div, show only on click*/
    .parentDisable
    {
    z-index: 999;
    width: auto;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    background-color: #fff;
    color: #aaa;
    }
    </style>
    
    <script type="text/javascript">
    
    //used for draging div
    function agent(v)
    {
    return(Math.max(navigator.userAgent.toLowerCase().indexOf(v),0));
    }
    function xy(e,v)
    {
    return(v?(agent('msie')?event.clientY+document.body.scrollTop:e.pageY):(agent('msie')?event.clientX+document.body.scrollTop:e.pageX));
    }
    
    function dragOBJ(d,e)
    {
    
    function drag(e)
    {
    if(!stop)
    {
    d.style.top=(tX=xy(e,1)+oY-eY+'px');
    d.style.left=(tY=xy(e)+oX-eX+'px');
    }
    }
    
    var oX=parseInt(d.style.left),oY=parseInt(d.style.top),eX=xy(e),eY=xy(e,1),tX,tY,stop;
    
    document.onmousemove=drag;
    document.onmouseup=function()
    {
    stop=1;
    document.onmousemove='';
    document.onmouseup='';
    };
    }
    
    //used for pop-up div
    function pop(div)
    {
    document.getElementById(div).style.display='block';
    return false
    }
    function hide(div)
    {
    document.getElementById(div).style.display='none';
    return false
    }
    </script>
    </HEAD>
    
    <BODY>
    
    <a href='#' onClick="return pop('myDiv')">Click Here</a> to popup div
    
    <div style="position: fixed; width: 500px; top: 150px; left: 250px; cursor: move;" onmousedown="dragOBJ(this,event); return false;">
    <div id='myDiv' class='parentDisable'>
    <TABLE border = "1" width="30%">
    <TR>
    <TD colspan="2" align="right"><a href="#" onClick="return hide('myDiv')">Close</a></TD>
    </TR>
    <TR>
    <TD>A</TD>
    <TD>B</TD>
    </TR>
    <TR>
    <TD>C</TD>
    <TD>D</TD>
    </TR>
    <TR>
    <TD>E</TD>
    <TD>F</TD>
    </TR>
    </div>
    </div>
    
    </BODY>
    </HTML>

  3. #3
    Join Date
    Apr 2008
    Posts
    49

    Re: To move pop-up div window

    I tried using this: See if this helps you too.

    Code:
    document.getElementById("mainDiv").style.left=4px ;
    document.getElementById("mainDiv").style.top=30px;
    Is there any other way?

Similar Threads

  1. Not able to move web history to the search window
    By Tufan in forum Technology & Internet
    Replies: 3
    Last Post: 26-06-2011, 05:01 AM
  2. how to move window explorer in Ubuntu Linux
    By Aadidev in forum Operating Systems
    Replies: 5
    Last Post: 22-06-2011, 07:56 AM
  3. Not able to move Internet Explorer 9 Window
    By Visidon in forum Technology & Internet
    Replies: 4
    Last Post: 14-10-2010, 05:08 PM
  4. How to move window 7 to a different partition?
    By Kaufman in forum Operating Systems
    Replies: 4
    Last Post: 01-04-2010, 12:25 AM
  5. How to move a window from one PC to another PC
    By Jimyk in forum Hardware Peripherals
    Replies: 1
    Last Post: 08-11-2008, 01:59 PM

Tags for this Thread

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
  •  
Page generated in 1,711,646,976.31923 seconds with 16 queries