Results 1 to 4 of 4

Thread: Want to create a div in a page to acquire full page height

  1. #1
    Join Date
    Feb 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation Want to create a div in a page to acquire full page height

    I created a div (testdiv) and want it to acquire full screen height in IE and FF. It wis working fine in IE but in FF it is not working...
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>


    <body>

    <div id="testdiv" style="background:red;">Content for id "testdiv" Goes Here</div>

    <script language="javascript">

    var frame = document.getElementById("testdiv");


    frame.style.height =parseInt(document.documentElement.clientHeight) - 156;

    </script>
    </body>
    </html>


    please help me out to make it work in FF thank u

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,496
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    There are a number of heights involved with the computer monitor and the browser. Before I can answer this question I would need to know which one you want your division to be. There are:

    • The height of the screen.
    • The available height on the screen.
    • The height of the browser.
    • The height of the viewable area in the browser window.
    • The height of the page within the browser window.


    Which one of these are you after?
    - John
    ________________________

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

  3. #3
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    
    
    <body>
    
    <div id="testdiv" style="background:red;">Content for id "testdiv" Goes Here</div>
    <script language="javascript">
    
    function zxcWWHS(){
     if (window.innerHeight) return [window.innerWidth-10,window.innerHeight-10,window.pageXOffset,window.pageYOffset];
     else if (document.documentElement.clientHeight) return [document.documentElement.clientWidth-10,document.documentElement.clientHeight-10,document.documentElement.scrollLeft,document.documentElement.scrollTop];
     return [document.body.clientWidth,document.body.clientHeight,document.body.scrollLeft,document.body.scrollTop];
    }
    
    
    
    var frame = document.getElementById("testdiv");
    
    frame.style.height =zxcWWHS()[1] - 156+'px';
    
    </script>
    </body>
    </html>

  4. #4
    Join Date
    Feb 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    thank you.. Phillips..

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
  •