offset()

一、语法

1、 返回偏移坐标

$(selector).offset();

top: $(selector).offset().top;

left: $(selector).offset().left;

获取匹配元素在当前视口的相对偏移。 总是计算相对于文档的位置,无论元素的父元素或祖先元素的position属性是什么。
返回的对象包含两个整形属性:top 和 left。此方法只对可见元素有效。

2. css()---left top

css的left和top属性指的是距最近的一个position属性为relative或者absolute的父级元素的左边后上边的距离,

明白了css的left和top的含义,可以看下jquery获取css的值,因为left和top也都是普通的css属性所以可以使用如下代码来获取

var left = $('#test').css('left');

var top = $('#test').css('top');

3.scrollTop() 方法

scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置。

scroll top offset 指的是滚动条相对于其顶部的偏移。

如果该方法未设置参数,则返回以像素计的相对滚动条顶部的偏移。

语法

$(selector).scrollTop(offset)

jquery offset(),的更多相关文章

  1. 转学步园:jquery offset

    JQuery Offset实验与应用 我们有时候需要实现这样一种功能:点击一个按钮,然后在按钮的下方显示一个div.当按钮位于角落时,div的位置设定就需要计算,使div完全显示. 我打算使用offs ...

  2. Jquery Offset, Document, Window 都是什么

    From http://www.cnblogs.com/luhe/archive/2012/11/14/2769263.html   JQuery Offset实验与应用 我们有时候需要实现这样一种功 ...

  3. jQuery offset()源码解析

    首先是原型上的offset方法,根据arguments判断到底是取值还是设值.如果是设置,就遍历调用静态方法jQuery.offset.setOffset 如果是取值.那么就是从"var d ...

  4. jQuery offset,position,offsetParent,scrollLeft,scrollTop html控件定位 css position

    定位应用:点击一个按钮,然后在按钮的右边弹出一个提示框 1,提示框相对于屏幕进行定位,那么使用offset来取得当前按钮相对于body的top和left,然后通过$('body').prepend(t ...

  5. jquery offset() 与position()方法的区别

    jquery 中有两个获取元素位置的方法offset()和position(),这两个方法之间有什么异同?使用的时候应该注意哪些问题?什么时候使用offset(),什么时候又使用position()呢 ...

  6. jquery offset positon 获取位置不准的解决方法

    问题: 本地开发时,由于使用了图片,而且使用了offset().top涉及到图片所在的div距离计算的部分,本地开发一切都没问题:但是部署到服务器上时却出现布局错乱,经过排查发现总是少了一个图片高度的 ...

  7. jquery offset()和position()的区别

    <script src="jquery/jquery-3.3.1.min.js"></script> <script type="text/ ...

  8. jquery offset tip

    /* * 这是一张 JavaScript 代码草稿纸. * * 输入一些 JavaScript,然后可点击右键或从“执行”菜单中选择: * 1. 运行 对选中的文本求值(eval) (Ctrl+R): ...

  9. jQuery offset()函数 和 scrollTop()函数

    $(dom).offset() 方法返回或设置匹配元素相对于文档的偏移(位置).{left:100,top:100} $(dom).scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置. ...

随机推荐

  1. VS2010下创建WEBSERVICE,第二天 ----你会在C#的类库中添加web service引用吗?

    本文并不是什么高深的文章,只是VS2008应用中的一小部分,但小部分你不一定会,要不你试试: 本人对于分布式开发应用的并不多,这次正好有一个项目要应用web service,我的开发环境是vs2008 ...

  2. samba基本应用24-4及示例

    samba smb:service message block(137/udp, 138/udp, 139/tcp, 445/tcp) 协议是:CIFS:Common Internet File Sy ...

  3. POJ 2104 K-th Number(主席树模板题)

    http://poj.org/problem?id=2104 题意:求区间$[l,r]$的第k小. 思路:主席树不好理解啊,简单叙述一下吧. 主席树就是由多棵线段树组成的,对于数组$a[1,2...n ...

  4. 【BZOJ】[HNOI2015]菜肴制作

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=4010 要是考场上想不出,但是还是有一个分治的做法的嘛 做法就是反向连边,然后再反向输出字典 ...

  5. Linux Shell学习笔记(一)

    Shell,见名知意,就是一个作为用户与Linux OS间接口的程序,允许用户向OS输入需要执行的命令.Shell众多,这里只介绍Bash. 0)实验的Shell版本 显示shell版本: /bin/ ...

  6. PCH Warning: header stop cannot be in a macro or #if block.

    在编写头文件时,遇到这么一个warning:PCH Warning: header stop cannot be in a macro or #if block. An intellisense PC ...

  7. Goroutines和Channels(四)

    如果说goroutine是Go语言程序的并发体的话,那么channels则是它们之间的通信机制. 一个channel是一个通信机制,它可以让一个goroutine通过它给另一个goroutine发送值 ...

  8. Springboot 如何加密,以及利用Swagger2构建Restful API

    先看一下使用Swagger2构建Restful API效果图 超级简单的,只需要在pom 中引用如下jar包 <dependency> <groupId>io.springfo ...

  9. Android开机广播和关机广播

    有些时候我们需要我们的程序在系统开机后能自动运行,这个时候我们可以使用Android中的广播机制,编写一个继承BroadcastReceiver的类,接受系统启动关闭广播.代码如下: /** *@au ...

  10. LeetCode--028--实现strSTR()

    问题描述: 给定一个 haystack 字符串和一个 needle 字符串,在 haystack 字符串中找出 needle 字符串出现的第一个位置 (从0开始).如果不存在,则返回  -1. 示例 ...