scrollHeight: 获取对象的滚动高度。  

scrollLeft:设置或获取位于对象左边界和窗体中眼下可见内容的最左端之间的距离

scrollTop:设置或获取位于对象最顶端和窗体中可见内容的最顶端之间的距离

scrollWidth:获取对象的滚动宽度

offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度

offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左側位置

offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置  

event.clientX 相对文档的水平座标

event.clientY 相对文档的垂直座标



event.offsetX 相对容器的水平坐标

event.offsetY 相对容器的垂直坐标  

document.documentElement.scrollTop 垂直方向滚动的值

event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量  



  以上主要指IE之中,FireFox差异例如以下:

IE6.0、FF1.06+:

clientWidth = width + padding

clientHeight = height + padding

offsetWidth = width + padding + border

offsetHeight = height + padding + border

IE5.0/5.5:

clientWidth = width - border

clientHeight = height - border

offsetWidth = width

offsetHeight = height

(须要提一下:CSS中的margin属性,与clientWidth、offsetWidth、clientHeight、offsetHeight均无关)

 

 

onMouseover当鼠标经过的时候,触发 = 后面的脚本函数 
onMouseout 当鼠标离开 。。 
onMouseUP 当鼠标 按下又抬起。。。 
当鼠标移动。。 
当鼠标按下时。。

 

如果 obj 为某个 HTML 控件。

obj.offsetTop 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算上側位置,整型,单位像素。

obj.offsetLeft 指 obj 相对于版面或由 offsetParent 属性指定的父坐标的计算左側位置,整型,单位像素。

obj.offsetWidth 指 obj 控件自身的绝对宽度,不包含因 overflow 而未显示的部分,也就是事实上际占领的宽度,整型,单位像素。

obj.offsetHeight 指 obj 控件自身的绝对高度,不包含因 overflow 而未显示的部分,也就是事实上际占领的高度,整型,单位像素。

我们对前面提到的 offsetParent 作个说明。

offsetParent 获取定义对象 offsetTop 和 offsetLeft 属性的容器对象的引用。offsetTop 与 offsetParent 非常复杂,不同浏览器有不同解释,浮动一下解释又不同了,所以我们一般仅仅要理解通过二者能够获得控件在浏览器中的绝对位置就可以。

以上属性在 FireFox 中也有效。

另外:我们这里所说的是指 HTML 控件的属性值,并非 document.body,document.body 的值在不同浏览器中有不同解释(实际上大多数环境是因为对 document.body 解释不同造成的,并非因为对 offset 解释不同造成的)

 

 

我们知道 offsetTop 能够获得 HTML 元素距离上方或外层元素的位置,style.top 也是能够的,二者的差别是:

一、offsetTop 返回的是数字,而 style.top 返回的是字符串,除了数字外还带有单位:px。

二、offsetTop 仅仅读,而 style.top 可读写。

三、假设没有给 HTML 元素指定过 top 样式,则 style.top 返回的是空字符串。

offsetLeft 与 style.left、offsetWidth 与 style.width、offsetHeight 与 style.height 也是相同道理。

 

 

clientHeight
大家对 clientHeight 都没有什么异议,都觉得是内容可视区域的高度,也就是说页面浏览器中能够看到内容的这个区域的高度,通常是最后一个工具条下面到状态栏以上的这个区域,与页面内容无关。

offsetHeight
IE、Opera 觉得 offsetHeight = clientHeight + 滚动栏 + 边框。
NS、FF 觉得 offsetHeight 是网页内容实际高度,能够小于 clientHeight。

scrollHeight
IE、Opera 觉得 scrollHeight 是网页内容实际高度,能够小于 clientHeight。
NS、FF 觉得 scrollHeight 是网页内容高度,只是最小值是 clientHeight。

简单地说
clientHeight 就是透过浏览器看内容的这个区域高度。
NS、FF 觉得 offsetHeight 和 scrollHeight 都是网页内容高度,仅仅只是当网页内容高度小于等于 clientHeight 时,scrollHeight 的值是 clientHeight,而 offsetHeight 能够小于 clientHeight。
IE、Opera 觉得 offsetHeight 是可视区域 clientHeight 滚动栏加边框。scrollHeight 则是网页内容实际高度。

同理
clientWidth、offsetWidth 和 scrollWidth 的解释与上面同样,仅仅是把高度换成宽度就可以。

说明
以上基于 DTD HTML 4.01 Transitional,假设是 DTD XHTML 1.0 Transitional 则意义又会不同,在 XHTML 中这三个值都是同一个值,都表示内容的实际高度。新版本号的浏览器大多支持依据页面指定的 DOCTYPE 来启用不同的解释器

scrollTop 是“卷”起来的高度值,演示样例:


假设为 p 设置了 scrollTop,这些内容可能不会全然显示。