jquery获取滚动距离，js获取div滚动高度

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

jQuery实现将div中滚动条滚动到指定位置的方法

1、(selector).scrolltop(offset)可以设置滚动条位置。

2、可见高度：viewHeight，可以理解为打开见浏览器空白页见到的空白区域的高度。内容高度：containHeight，这个就是我们关心的高度，它是内容的总高度，包括隐藏在滚动条下面的内容。

3、可以将DIV的滚动条滚动到其子元素所在的位置，方便自动定位。

4、新建html文档。书写hmtl代码。书写css代码。* { margin： 0； padding： 0； list-style： none； }img { border： none； }body { font-family： Arial， Helvetica， sans-serif； }。书写并添加js代码。

5、在css标签内，定义div的样式，设置其宽度为100px，高度为2000px，背景颜色为粉红色。在js标签内，使用scroll()方法监听页面的滚动条，并执行function方法。

6、可以设置div的scrollTop值。div当中有滚动的时候，设置scrollTop可以滚动到指定的滚动顶部位置。如果需要动画，可以使用css3的过渡或者动画函数，jquery可以用animate函数。

相关问答

Q1: 如何通过JQuery将DIV的滚动条滚动到指定的位置

1、这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置，方便自动定位。

2、新建html文档。书写hmtl代码。书写css代码。* { margin： 0； padding： 0； list-style： none； }img { border： none； }body { font-family： Arial， Helvetica， sans-serif； }。书写并添加js代码。

3、可以将DIV的滚动条滚动到其子元素所在的位置，方便自动定位。

Q2: JS判断怎么鼠标向下滑的距离(就是滚动条下拉的距离)

1、clientX、clientY 点击位置距离当前body可视区域x，y坐标。pageX、pageY 对于整个页面来说，包括被卷去的body部分的长度。screenX、screenY 点击位置距离当前电脑屏幕的X、Y坐标。

2、scrollTop为滚动条在Y轴上的滚动距离。clientHeight为内容可视区域的高度。scrollHeight为内容可视区域的高度加上溢出（滚动）的距离。so，滚动条到底部的条件即为scrollTop + clientHeight == scrollHeight。

3、不懂什么意思，如果你要获取前一次滚动和本次滚动的差值，用个隐藏文本框记录前一次滚动的距离，然后用本次的减去前一次，并把本次的刷新到文本框。

4、当然，并不是任何时候移动鼠标都要造成元素的移动，而应该判断鼠标左键的状态是否为按下状态，是否是在可拖拽的元素上按下的。

5、为了增强用户体验，通过判断是否有滚动条而添加 margin-left 属性以抵消 overflow： hidden 之后的滚动条位置。

6、} 后面为一些常用属性方便查找：clientHeight 获取对象的高度，不计算任何边距、边框、滚动条，但包括该对象的补白。clientLeft 获取 offsetLeft 属性和客户区域的实际左边之间的距离。

Q3: 如何用jquery获得页面元素到窗口顶部的距离?

//假设元素ID为test，获取它到父元素的距离$( #test ).offset().top；//获取到父元素的距离。

首先在html页面上，看到有一个按钮，要获得这个按钮离顶部的距离。在按钮的事件函数里，先取这个按钮的offset数据，通过jquery的offset方法。得到的结果是一个数组对象，只要获取里面的top数据就行了。

设置多个标签，这样等会可以有更多选择。创建一个JS文档，并且与HTML文档关联。输入var test = document.getElementById( pp).offsetTop；document.write( test )。offsetLeft就能知道元素到顶部的距离。