常见浏览器的宽高代码写法！有原生JavaScript和jquery两种写法-------------------------------以及我的个人网站

我的个人网站

点击链接！欢迎大家访问

下面是网页一些常见的宽高的获取。。。。。。。。。这是原生的写法（JavaScript）

网页可见区域宽： document.body.clientWidth
网页可见区域高： document.body.clientHeight
网页可见区域宽： document.body.offsetWidth (包括边线的宽)
网页可见区域高： document.body.offsetHeight (包括边线的高)
网页正文全文宽： document.body.scrollWidth
网页正文全文高： document.body.scrollHeight
网页被卷去的高： document.body.scrollTop
网页被卷去的左： document.body.scrollLeft
网页正文部分上： window.screenTop
网页正文部分左： window.screenLeft
屏幕分辨率的高： window.screen.height
屏幕分辨率的宽： window.screen.width
屏幕可用工作区高度： window.screen.availHeight
屏幕可用工作区宽度： window.screen.availWidth

接下来是jquery的写法

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

alert($(document).height());
//浏览器当前窗口文档的高度

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

alert($(document.body).outerHeight(true));
//浏览器当前窗口文档body的总高度 包括border padding margin

alert($(window).width());
//浏览器当前窗口可视区域宽度

alert($(document).width());
//浏览器当前窗口文档对象宽度

alert($(document.body).width());
//浏览器当前窗口文档body的高度

alert($(document.body).outerWidth(true));
//浏览器当前窗口文档body的总宽度 包括border padding margin

原生滚动事件的一些数据计算-------------什么时候到顶部了，居顶部有多少。。。

window.onscroll = function(){

var scrollT = document.documentElement.scrollTop||document.body.scrollTop;
 //居上滚动了多少高度

var scrollH = document.documentElement.scrollHeight||document.body.scrollHeight;
 //页面总高度

var clientH = document.documentElement.clientHeight||document.body.clientHeight;
 //页面可视区域的高度

var s1=document.getElementById("s1").offsetTop;    //元素距顶部有多少像素

if(scrollT == scrollH - clientH){
alert("到底部了");
}else if(scrollT == 0){
alert("到顶部了");
}

jquery滚动常见的一些数据获取。。。

获取滚动条到顶部的垂直高度 ：$(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