jquery Get document height and window height Rollup _jquery

jquery Gets the window height and window height, $ (document). Height (), $ (window). Height ()

1. $ (document). Height (): Document height of the entire Web page
2. $ (window). Height (): Height of the browser visual window
3. $ (window). scrolltop (): Height of the top of the browser's visual window from the top of the page (vertical offset)
4. $ (document.body). Height ();//browser Current window document body level
5. $ (document.body). Outerheight (true);//browser Current window document body's total height includes border padding margin
6. $ (window). width (); Browser current window visual area width
7. $ (document). Width ()//Browser Current window Document object widths
8. $ (document.body). width ();//browser Current window document body height
9. $ (document.body). Outerwidth (true);//Browser The total width of the body of the current window document includes border padding margin

A word to understand is this: when the Web scroll bar is pulled to the lowest end, $ (document). Height () = = $ (window). Height () + $ (window). scrolltop ().

$ (document) when the page is not high enough for the browser window. Height () returns $ (window). Height ().

It is not recommended to use $ ("html"). Height (), $ ("body"). Heights ().

Reason:

$ ("body"). Height (): The body may have a border, and the height will be higher than $ (document). Height () small;

$ ("html"). Height (): The height of the different browsers to get the meaning of the difference will be, the plain is that the browser is not compatible.

$ (window). Height () value problem, not return the height of the browser window?

Reason: Web page does not add <! Doctype> statement.

JS get page height and window height

Practical application: Set the appropriate height of the content area

Set content area appropriate height
  var doch = $ (document). Height (),
    Winh = $ (window). Height (),
    Headerh = $ (". Header"). Outerheight ();
    Footerh = $ (". Footer"). Outerheight ();
  if (doch<=winh+4) {
    $ ("Div.container"). Height (winh-headerh-footerh-50);