jquery获取元素到页面顶部的距离

OECOM

发布于 2020-07-01 09:27:08

5.7K00

代码可运行

文章被收录于专栏：OECOMOECOM

运行总次数：0

代码可运行

2017-01-19 15:07:44

在前端开发过程中，经常会遇到要求滚动条滚动到某位置时某按钮固定在页面上，否则悬浮于页面上。这时就会用到获取需要固定在页面位置的元素距离页面顶部的距离，通过比较文档滚动条到顶部的距离和页面元素到顶部距离的大小便可确定。

在jquery中有一个语句可以获取到元素到顶部的距离，语法为

$(selector).offset().top

下面看一个例子

<div style="height:800px"> </div>
<div id="footer_luofanitng_com_cn" style="text-align:center; margin-left:auto;margin-right:auto; margin-top:20px">落帆亭 Copyright<span style="font-family:Arial;">&copy;</span> <span style="font-size:18px;">luofanting.com.cn
</span></div>