jquery距离底部的距离，jquery获取元素距离顶部的距离

jQuery(JS)怎么判断滚动条快到底部了就触发函数

首先，我们拉动滚动条，从最上面拉到最下面，变化的是scrollTop的值，而这个值是有一个区间的。

在js标签内，使用scroll()方法监听页面的滚动条，并执行function方法。

若要想判断js window.scroll是否滚动到底部，需要用的三个属性值，它们分别是：scrollTop、clientHeight和scrollHeight；scrollTop为滚动条在Y轴上的滚动距离。clientHeight为内容可视区域的高度。

JS：当滑块的offsetTop等于滚动条减去滑块高度时，滑到底。

可以这么试一下 在你的页面上某个位置放一个div或者就用你页面上已有的某个元素也行，当用户滚动的时候这个div相对于浏览器的顶部或底部的距离肯定会变化，然后你通过这个距离来判断用户浏览到当前页面的什么位置了。

前言最近在写插件的过程中，需要使用 JS 判断是否有滚动条，搜了一下，大致方法都差不多，但都有些_嗦，代码不够简洁。最终通过参考不同方法，写了一个比较简单的方法。

相关问答

Q1: jquery如何获取某个元素距离它父级的偏移量啊

//距离UI的上边距 50 alert(flag.position().top+flag.height())；//得到75，需加上自身高度 })；可以通过position方法获取。

position()方法获取匹配元素相对父元素的偏移量。即获取的是该元素相对于最近的一个拥有绝对定位或者相对定位的父元素的偏移量。

offset()方法获取匹配元素在当前窗口的相对偏移量。这里的窗口指的是当前页面的窗口，不包括浏览器的菜单栏等，当然我们也不太需要使用jquery来控制整个浏览器，我们所要控制的是页面窗口。

offset({top：offset.top，left：offset.left})如何用Jquery获取某一个Div的Class或者ID？首先，要用jquery获取到这个元素，用attr方法可以输出这个元素的标签属性。

Q2: scrollHeight,clientHeight,scrollTop明晰

需要三个高度： scrollHeight（文档内容实际高度， 包括超出视窗的溢出部分 ）、 scrollTop（滚动条滚动距离）、 clientHeight（窗口可视范围高度）。

首先理解三个dom元素，分别是：clientHeight、offsetHeight、scrollTop。首先理解三个dom元素，分别是：clientHeight、offsetHeight、scrollTop。

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

scrollTop： 被隐藏在内容区域上方的像素数。通过设置这个属性可以改变元素的滚动位置。带有垂直滚动条的页面总高度：document.documentElement.scrollHeight，如果想要获取文档高度，需要找到 scrollHeight 和 clientHeight 中的最大值。

scrollHeight IE、Opera 认为 scrollHeight 是网页内容实际高度，可以小于 clientHeight。NS、FF 认为 scrollHeight 是网页内容高度，不过最小值是 clientHeight。简单地说 clientHeight 就是透过浏览器看内容的这个区域高度。

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

Q3: js中如何获取某个元素到浏览器最左和最右的距离?

1、可以判断一个物体的跟document的左边距离，也就是浏览器左边缘。写一个div 获取这个div之后alert(你的div.offsetLeft)就可以距离浏览器左边的距离。

2、你好，JS没有直接获取元素相对于页面的绝对坐标的方法。但是我们可以通过相关值的计算而得到。

3、打开sublime text3，也可以用其他编辑器，这里新建一个HTML文档作为示范。创建一下HTML文档的基本架构。设置多个标签，这样等会可以有更多选择。创建一个JS文档，并且与HTML文档关联。

4、您好：鼠标距离div上边的距离距=鼠标所在位置距离浏览器上边的距离-div上边离浏览器上边的距离。div离浏览器的的距离可以用js中的offsetTop方法获得。鼠标所在位置可以用js中的clientY来获得。

5、jquery代码直接使用 $(window).height()。获取浏览器的宽度：jquery代码直接使用 $(window).With()；原生态JS代码：var w=document.documentElement？document.documentElement.clientWidth：document.body.clientWidth。

6、var top = obj.getBoundingClientRect().top //元素顶端到可见区域顶端的距离 var se = document.documentElement.clientHeight //浏览器可见区域高度。

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

1、(obj).offset().top - $(window).scrollTop()。拓展：jQuery是一套跨浏览器的JavaScript库，简化HTML与JavaScript之间的操作。由John Resig在2006年1月的BarCamp NYC上发布第一个版本。

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

3、新建一个html文件。为了更好区分，会创建两个按钮标签，然后给这两个按钮标签添加不同的id。引入jquery文件（注：jquery的引入路径一定要正确）。创建加载完成函数，然后创建一个点击按钮获取当前id的函数。

Q5: jquery怎么获取元素距离屏幕的位置?

1、首先，打开html编辑器，新建html文件，例如：index.html，并引入jquery。

2、(obj).offset().top - $(window).scrollTop()。拓展：jQuery是一套跨浏览器的JavaScript库，简化HTML与JavaScript之间的操作。由John Resig在2006年1月的BarCamp NYC上发布第一个版本。

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

4、，获取对象 var obj = $(#id号)； 或 var obj = $(this)；实例中我获取的对象是弹出窗口按钮，这样创建的新窗口就会根椐按钮的位置进行调整，实例中将创建的新窗口显示的按钮的右下角。

关于jquery距离底部的距离和jquery获取元素距离顶部的距离的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。