[Reprint]js and jquery get the height of the page and scroll bar height of the viewport document height

• Reprinted from: http://www.cnblogs.com/rainbow661314/p/3317106.html
• JS and jquery Get the height of the page and scroll bar
• Page position and window size
• function GetPageSize () {
• var scrw, SCRH;
• if (window.innerheight
• && Window.scrollmaxy)
• { //Mozilla
• SCRW =
• Window.innerwidth + Window.scrollmaxx;
• SCRH = Window.innerheight +
• Window.scrollmaxy;
• }
• else if (Document.body.scrollHeight >
• Document.body.offsetHeight)
• { //all but IE Mac
• SCRW =
• Document.body.scrollWidth;
• SCRH = Document.body.scrollHeight;
• } Else
• if (document.body)
• { //IE Mac
• SCRW = Document.body.offsetWidth;
• SCRH = Document.body.offsetHeight;
• }
• var winw, Winh;
• if (window.innerheight)
• { //all except IE
• WINW =
• Window.innerwidth;
• Winh = Window.innerheight;
• } Else if
• (Document.documentelement &&
• Document.documentElement.clientHeight)
• { //IE 6 Strict Mode
• WINW =
• Document.documentElement.clientWidth;
• Winh =
• Document.documentElement.clientHeight;
• } Else if (document.body) { //
• Other
• WINW = Document.body.clientWidth;
• Winh =
• Document.body.clientHeight;
• } //For small pages and total size less
• Then the viewport
• var Pagew = (SCRW<WINW)? WINW:SCRW;
• var Pageh =
• (Scrh<winh)? WINH:SCRH;
• return {Pagew:pagew, Pageh:pageh,
• WINW:WINW, Winh:winh};
• };
• scroll bar position
• function Getpagescroll ()
• {
• var x, y;
• if (Window.pageyoffset)
• { //all except IE
• y =
• Window.pageyoffset;
• x = Window.pagexoffset;
• } Else
• if (document.documentelement && document.documentElement.scrollTop)
• { //IE 6 Strict
• y = Document.documentElement.scrollTop;
• X
• = Document.documentElement.scrollLeft;
• } Else if (document.body) { // All
• Other IE
• y = Document.body.scrollTop;
• x =
• Document.body.scrollLeft;
• }
• return {x:x,
• Y:y};
• }
• Jquery
• Get the height of the browser display area:
• $ (window). Height ();
• Gets the width of the browser display area: $ (window). width ();
• Gets the document height of the page
• : $ (document). Height ();
• Gets the document width of the page: $ (documents). width ();
• Gets the vertical height of the scroll bar to the top
• : $ (document). ScrollTop ();
• Gets the vertical width of the scroll bar to the left: $ (document). ScrollLeft ();
• Calculate element position and offset
• The offset method is a useful way to return the offset information for the first element in a wrapper set. By default, the offset information is relative to the body. The result contains top and left two properties.
• Offset (options, results)
• Options.relativeto Specify a relative count
• The ancestor element that calculates the offset position. This element should be relative or absolute positioned. Omitted is relative to body.
• Does the Options.scroll
• Scroll bar calculation, default True
• options.padding whether to calculate padding, default false
• Options.margin
• Whether margin is counted, by default true
• Options.border whether the border is counted, by default true
• http://www.cnblogs.com/hoojo/archive/2012/02/16/2354663.html
• Alert ($ (window). Height ()); //Browser Current window viewable area height
• Alert (document). Height ()); //Browser height of the current window document
• Alert ($ (document.body). Height ()); //Browser The height of the body of the current window document
• Alert ($ (document.body). Outerheight (True)); Browser Current Window document body total height includes border padding margin
• Alert ($ (window). width ()); //Browser Current window viewable area width
• Alert (document). width ()); //Browser Current Window Document object width
• Alert ($ (document.body). width ()); //Browser The height of the body of the current window document
• Alert ($ (document.body). Outerwidth (True)); Browser Current Window document body total width includes border padding margin
• Gets the height and width of the page
• function GetPageSize () {
• var xscroll, Yscroll;
• if (window.innerheight && window.scrollmaxy) {
• Xscroll = window.innerwidth + Window.scrollmaxx;
• Yscroll = Window.innerheight + window.scrollmaxy;
• } Else {
• if (Document.body.scrollHeight > Document.body.offsetHeight) { //all but Explorer Mac
• Xscroll = Document.body.scrollWidth;
• Yscroll = Document.body.scrollHeight;
• } else { //Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
• Xscroll = Document.body.offsetWidth;
• Yscroll = Document.body.offsetHeight;
• }
• }
• var windowwidth, WindowHeight;
• if (self.innerheight) { //all except Explorer
• if (document.documentElement.clientWidth) {
• WindowWidth = Document.documentElement.clientWidth;
• } Else {
• WindowWidth = Self.innerwidth;
• }
• WindowHeight = Self.innerheight;
• } Else {
• if (document.documentelement && document.documentElement.clientHeight) { //Explorer 6 Strict Mode
• WindowWidth = Document.documentElement.clientWidth;
• WindowHeight = Document.documentElement.clientHeight;
• } Else {
• if (document.body) { //other explorers
• WindowWidth = Document.body.clientWidth;
• WindowHeight = Document.body.clientHeight;
• }
• }
• }
• /For small pages and total height less then height of the viewport
• if (Yscroll < windowheight) {
• PageHeight = WindowHeight;
• } Else {
• PageHeight = Yscroll;
• }
• /For small pages and total width less then width of the viewport
• if (Xscroll < windowwidth) {
• PageWidth = Xscroll;
• } Else {
• PageWidth = WindowWidth;
• }
• Arraypagesize = New Array (PageWidth, PageHeight, WindowWidth, windowheight);
• return arraypagesize;
• }
• scroll bar
• Document.body.scrollTop;
• $ (document). ScrollTop ();

[Reprint]js and jquery get the height of the page and scroll bar height of the viewport document height