页面里各种高度，宽度，距离

top 高度距离 left左边距离 right右边距离
width宽 height高
先看清！
紫色的线 就是scrollTop 滚动条的滑动距离
var t=document.documentElement.scrollTop||document.body.scrollTop;

documentElement 和 body 相关说明：
body是DOM对象里的body子节点，即 标签； documentElement 是整个节点树的根节点root，即 标签； DOM把层次中的每一个对象都称之为节点，就是一个层次结构，你可以理解为一个树形结构，就像我们的目录一样，一个根目 录，根目录下有子目录，子目录下还有子目录。 以 HTML超文本标记语言为例：整个文档的一个根就是,在DOM中可以使用document.documentElement来访问它，它就是整个节点树的 根节点。而body是子节点，要访问到body标签，在脚本中应该写：document.body。

蓝色的线 就是clientHight 可视区的高；

棕色的线 就是offsetHeight 内容的实际高度不带px；
IE、Opera 认为 offsetHeight = clientHeight + 滚动条 + 边框。
NS、FF 认为 offsetHeight 是内容实际高度，可以小于 clientHeight。

这几个距离总结下，防止忘记。

用clientHeight的时候 必须 document.body.clientHeight

scrollHeight是元素的padding加元素内容的高度。这个高度与滚动条无关，是内容的实际高度。
计算方式 ：scrollHeight = topPadding + bottomPadding + 内容margix box的高度。