日期:2014-05-16  浏览次数:20379 次

js 和 jquery 获取页面和滚动条的高度

?

js 和 jquery 获取页面和滚动条的高度

//页面位置及窗口大小

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 with 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};

};


//滚动条位置
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


获取浏览器显示区域的高度 :?
$(window).height();?
获取浏览器显示区域的宽度 :$(window).width();?
获取页面的文档高度?
:$(document).height();?
获取页面的文档宽度 :$(document).width();

获取滚动条到顶部的垂直高度?
:$(document).scrollTop();?
获取滚动条到左边的垂直宽度 :$(document).scrollLeft();?


计算元素位置和偏移量?

offset方法是一个很有用的方法,它返回包装集中第一个元素的偏移信息。默认情况下是相对body的偏移信息。结果包含 top和left两个属性。

offset(options, results)?
options.relativeTo  指定相对计?
算偏移位置的祖先元素。这个元素应该是relative或absolute定位。省略则相对body。?
options.scroll  是否把?
滚动条计算在内,默认TRUE?
options.padding  是否把padding计算在内,默认false?
options.margin?
  是否把margin计算在内,默认true?
options.border  是否把边框计算在内,默认true

?

http://www.cnblogs.com/hoojo/archive/2012/02/16/2354663.html

alert($(window).height()); //浏览器当前窗口可视区域高度 
alert($(document).height()); //浏览器当前窗口文档的高度 
alert($(document.body).height());