网页卷去的距离与偏移量的问题探讨

本文主要是介绍网页卷去的距离与偏移量的问题探讨，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

网页卷去的距离与偏移量

方便直观下面有一张图：

scrollLeft:设置或获取位于给定对象左边界与窗口中目前可见内容的最左端之间的距离 ，即左边灰色的内容。

scrollTop:设置或获取位于对象最顶端与窗口中可见内容的最顶端之间的距离 ，即上边灰色的内容。
offsetLeft:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 。

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

注意:
1. 区分大小写

2. offsetParent：布局中设置postion属性(Relative、Absolute、fixed)的父容器，从最近的父节点开始，一层层向上找，直到HTML的body。

在JavaScript中如何获取的：下面是代码片段

<script type="text/javascript">function req(){var div = document.getElementById("div1");document.getElementById("li1").innerHTML = (div.offsetTop)+"px";//div1距离屏幕顶部的距离document.getElementById("li2").innerHTML = (div.offsetLeft)+"px";//div1距离屏幕左部的距离document.getElementById("li3").innerHTML = (div.scrollTop)+"px";//div1纵向滚动条滚动的距离document.getElementById("li4").innerHTML = (div.scrollLeft)+"px";//div1横向滚动条滚动的距离}
</script>

这篇关于网页卷去的距离与偏移量的问题探讨的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---