How to get the height of a body element

Question

Here the total height of all  lt div gt  s are 900 pixels  but the jQuery function returns the height of the body as 577 pixels   If I remove the body CSS  it s working    Is there a solution for this problem    j function         alert  j  body   height         html  body       height 100       lt div style  height 200px  gt header lt  div gt   lt div style  height 500px  gt content lt  div gt   lt div style  height 200px  gt footer lt  div gt

User · Answer

We were trying to avoid using the IE specific

$window[0].document.body.clientHeight

And found that the following jQuery will not consistently yield the same value but eventually does at some point in our page load scenario which worked for us and maintained cross-browser support:

$(document).height()

User · Answer

Simply use    document  height      -    body   offset   top   and   or    window  height     instead of    body   height

User · Answer

Set  html   height  100     body   min-height  100       instead of height  100    The result jQuery returns is correct  because you ve set the height of the body to 100   and that s probably the height of the viewport  These three DIVs were causing an overflow  because there weren t enough space for them in the BODY element  To see what I mean  set a border to the BODY tag and check where the border ends

User · Answer

I believe that the body height being returned is the visible height  If you need the total page height  you could wrap your div tags in a containing div and get the height of that

User · Answer

document  height   seems to do the trick and gives the total height including the area which is only visible through scrolling

[jquery] How to get the height of a body element

Examples related to jquery

Examples related to css