推荐设备MORE

网站商城制作哪家好—英语、

网站商城制作哪家好—英语、

疑难问题

scrollTop、scrollLeft、scrollWidth、scrollHeight

日期:2021-02-20
我要分享
offsetTop、offsetLeft、offsetWidth、offsetHeight scrollTop、scrollLeft、scrollWidth、scrollHeight clientHeight、offsetHeight、scrollHeight

scrollTop、scrollLeft、scrollWidth、scrollHeight

上边是一个网页页面,因为对话框大限的限定,沒有彻底显示信息出去,沒有显示信息出去的,用黑影标明了。

上黑影便是 scrollTop; 上黑影 + 白的 + 下黑影便是 scrollHeight。

scrollTop 是“卷”起來的高宽比值,实例:

div id="p"
  div id="t" 假如为 p 设定了 scrollTop,这种內容将会不容易彻底显示信息。 /div
/div
script type="text/javascript"
!--
var p = document.getElementById("p");
p.scrollTop = 10;
//--
/script

scrollTop、scrollLeft

因为为表层原素 p(留意是 p,并不是 t)设定了 scrollTop,因此里层原素会往上“卷”,这翻卷来的一部分便是 scrollTop。

scrollLeft 也是相近大道理。

scrollWidth、scrollHeight

大家早已了解 offsetHeight 是本身原素的高宽比,而 scrollHeight 是里层原素的具体高宽比 + 表层原素 padding,包括里层原素的掩藏的一部分。

所述中 p(留意是 p,并不是 t)的 offsetHeight 为 200,而其 scrollHeight 为 300。假如 p 具备 padding,那麼应当把 padding 算到 scrollHeight 中,但其 border、margin 不可测算以内。

scrollHeight 也是相近大道理。

IE 和 FireFox 全方位适用,而 Netscape 8(很年纪大了) 和 Opera 7.6(很年纪大了) 不兼容 scrollTop、scrollLeft(document.body.scrollTop、document.body.scrollLeft 以外)。

有关阅读文章

offsetTop、offsetLeft、offsetWidth、offsetHeight document.body.scrollTop 值总为0的处理方式
1 楼:评价scrollHeight ff 显著不兼容的2 楼:评价offsetHeight如何会是100呢?你没是说offsetHeight是本身原素的高宽比,那应当是200才对啊?3 楼:回应:offsetHeight如何会是100呢?你没是说offsetHeight是本身原素的高宽比,那应当是200才对啊?对,全文搞不对,我的笔误,早已改正,感谢。4 楼:评价offsetHeight应当包括border的总宽5 楼:评价现阶段早已适用了!6 楼:评价感谢,搞明白了....7 楼:评价假如把上边编码中的scrollTop换为scrollLeft,沒有转变啊,不容易向左卷呢?8 楼:RE:假如把上边编码中的scrollTop换为scrollLeft,沒有转变啊,不容易向左卷呢?由于实例中的高宽比是超过了器皿的,而总宽沒有,因此 scrollLeft 沒有转变。