center div over another div

Discussion in 'Javascript' started by Gernot Frisch, Mar 16, 2006.

  1. I want to center the div "KungFu" over the div "header".
    Does not.


    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//DE">
    <html>
    <body>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <p>

    <br>
    <nobr>
    <br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <div id="header">HERE IST THE HEADER</div></p>
    </nobr>

    <div id="KungFu"></div>
    <script type="text/javascript">
    //
    //
    //
    function displayFloatingDiv(divId, title, message, center_over_Id,
    width, height)
    {

    var left, top;
    var parent = document.getElementById(center_over_Id);
    left = Math.max(0, parent.offsetLeft+ (parent.offsetWidth-width));
    top = Math.max(0, parent.offsetTop+ (parent.offsetHeight-height));

    var Div = document.getElementById(divId);
    Div.style.position = 'absolute';
    Div.style.width = width + 'px';
    Div.style.height = height + 'px';
    Div.style.left = left + 'px';
    Div.style.top = top + 'px';

    alert(parent+' - l:'+left+' t:'+top+'
    w:'+(parent.offsetWidth-width));

    var addHeader;

    addHeader = '<table style="width:' + width + 'px" bgcolor="red">'
    +
    '<tr><td
    onclick="document.getElementById(\''+divId+'\').style.visibility=\'hidden\'">'
    + title + '</td>' +
    '<td style="width:18px" align="right">' +
    'Close...</td></tr><tr><td
    colspan="2">'+message+'</td></tr></table>';


    // add to your div an header
    Div.innerHTML = addHeader;

    Div.className = 'dimming';
    Div.style.visibility = "visible";
    }

    displayFloatingDiv("KungFu", "Title", "Some long message", "header",
    320, 240);


    </script>


    </body></html>
     
    Gernot Frisch, Mar 16, 2006
    #1
    1. Advertising

  2. Gernot Frisch

    Randy Webb Guest

    Randy Webb, Mar 16, 2006
    #2
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Ben Amada

    Replacement for <div align="center">

    Ben Amada, Nov 30, 2005, in forum: ASP .Net
    Replies:
    11
    Views:
    16,340
    Ben Amada
    Dec 1, 2005
  2. Noozer

    Center image in DIV?

    Noozer, Jan 14, 2004, in forum: HTML
    Replies:
    21
    Views:
    69,205
    Barry Pearson
    Jan 15, 2004
  3. Noozer
    Replies:
    15
    Views:
    41,128
    Mark Parnell
    Apr 19, 2004
  4. Sypher
    Replies:
    22
    Views:
    99,408
    xarzu
    Oct 19, 2011
  5. Replies:
    2
    Views:
    1,390
    Michael Winter
    Oct 10, 2005
Loading...

Share This Page