Too Cool for Internet Explorer

DIV layer with 100% height, the Javascript way   July 1st, 2009

When you create a div layer with 100% width and height, the height is always only the height of the browser window, not of the page content (which can be much higher).

To solve this, give the layer div an id and use the following JS code inside the layer div:

<script type="text/javascript">document.getElementById("yourlayerid").style.height = document.getElementsByTagName("body")[0].offsetHeight + "px";</script>

The code is very simple, it gets the height of the content (the body element) and gives it the layer div.

Tested in Opera, Firefox and *barf* MSIE (8).

Tags: , , , , , , ,
This entry was posted on Wednesday, July 1st, 2009 at 21:56 and is filed under Programming. You can follow any responses to this entry through the RSS 2.0 feed.You can leave a response, or trackback from your own site.

No Responses

Leave a Reply