话不多说先上图：

offset()的top是指元素与document的上边的距离，而不是浏览器当前窗体的上边缘，如图

document高度超过window，浏览器出现滚动条，滚动滚动条，提交按钮的offset不变。

总结一下：offsetTop是当前对象到其上级层顶部的距离.

不能对其进行赋值.设置对象到页面顶部的距离请用style.top属性.

JQ中的 offsetTop 和 offset().top 的区别的更多相关文章

  1. JQ的offset().top与js的offsetTop区别详解

    一.前言 最近在做一个图片懒加载的插件,就纵轴(Y轴)而言,我需要时时获取图片的上偏移量,好判断是否已进入视图区域,而我所理解的是offsetTop应该是跟offset().top一样的,然后陷入了因 ...

  2. JQ的offset().top与JS的getBoundingClientRect区别详解，JS获取元素距离视窗顶部可变距离

     壹 ❀ 引 我在 JQ的offset().top与js的offsetTop区别详解 这篇博客中详细分析了JQ方法offset().top与JS属性offsetTop的区别,并得出了一条offset( ...

  3. jquery的offset().top和js的offsetTop的区别，以及jquery的offset().top的实现方法

    jquery的offset().top和js的offsetTop的区别,以及jquery的offset().top的实现方法 offset().top是JQ的方法,需要引入JQ才能使用,它获取的是你绑 ...

  4. jquery的offset().top与javascript的offsetTop区别？

    offset().top是jquery的方法,需引入jquery,它获取你绑定元素上边框相对于html上边界的偏移量 offsetTop是原生js的方法,它获取你绑定元素上边框相对于离自己最近且pos ...

  5. div设置overflow-scroll滚动之后，jq获取其子元素的offset.top出现问题。

    先上个图: 布局很简单,左右超过屏幕的部分自行滚动. 1. html <div class="ce-container"> <div class="ce ...

  6. jQuery中animate与scrollTop、offset().top实例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. jquery的offset().top 和position().top 详解 和如何用js实现

    1 jquery定义: offset().top 相对于当前文档的坐标(的高度) ps:包括滚动条卷去的高度 position().top 返回的是相对于其定位的祖辈元素的坐标(的高度) ps:包括滚 ...

  8. javascript中常用坐标属性offset、scroll、client

    原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...

  9. jq中

    1.jquery位置信息 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

随机推荐

  1. java 8: ClassNotFoundException: sun.jdbc.odbc.JdbcOdbcDriver

    转眼之间, java 11都快要推出了. 而我一直都在 java 7环境下写代码,真的不想升级,不想改变什么,可世界每天都在变化. 最近因为服务端需要SNI,而 java 7 只支持客户端的SNI,只 ...

  2. mysql ibdata1损坏

    机房一台服务器上的mysql运行一段时间了,突然出现了一个很奇怪的现象:重启后无法恢复了!准确情况是:启动mysql后随即就又关闭了. 查看mysql错误日志如下: 160920 22:41:41 m ...

  3. Error[Pe020]: identifier "FILE" is undefined

    Error[Pe020]: identifier "FILE" is undefined 需要添加头文件:#include <stdio.h>

  4. java中一维数组的定义和遍历

    public class ArrayDemo1{ public static void main(String[] args){ //1 定义数组 并同时赋值 int[] arr = new int[ ...

  5. php调用API支付接口 转至http://www.cnblogs.com/chaochao00o/p/6490463.html

    首先访问  https://charging.teegon.com/  注册账号, 找到开发配置   记下client_id和client_secret. 点击 天工开放平台 点击天工收银 点击  S ...

  6. saltstack returners

    大意就是将saltstack 执行的结果,不在终端显示,写到文件或者数据库,功能类似于ansible的callback 参考 https://github.com/saltstack/salt/tre ...

  7. saltstack pillar

    piller组件定义与客户端相关的任何数据(定义在master端),定义好的数据可以被其他组件调用(如state,api) 说通俗了,一句话,就是ansible vars里定义的变量,可以在整个pla ...

  8. JDBC-DBCP

    依赖 pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xmlns=" ...

  9. SecureCRT for ubuntu 菜单消失

    两种解决方案. 1.先说网上查到的复杂的: 编辑CRT安装目录下的Global.ini 找到 D:"Show Menu Bar"=00000000 改成 D:"Show ...

  10. jsp页面的共用

    我们经常希望一个网页,根据不同得请求显示不同得数据. 方法就是在session中添加一个变量,根据不同得值区分不同得请求类型. 后台:request.getSession().setAttribute ...