offset([coordinates])

概述

获取匹配元素在当前视口的相对偏移。

返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。大理石平台价格表

参数

coordinates{top,left}ObjectV1.4

必需。规定以像素计的 top 和 left 坐标。

可能的值:

  • 值对,比如 {top:100,left:0}
  • 带有 top 和 left 属性的对象

function(index,coords)functionV1.4

规定返回被选元素新偏移坐标的函数。

  • index - 可选。接受选择器的 index 位置
  • oldvalue - 可选。接受选择器的当前坐标

示例

无参数描述:

获取第二段的偏移

HTML 代码:
<p>Hello</p><p>2nd Paragraph</p>
jQuery 代码:
var p = $("p:last");
var offset = p.offset();
p.html( "left: " + offset.left + ", top: " + offset.top );
结果:
<p>Hello</p><p>left: 0, top: 35</p>

参数coordinates 描述:

获取第二段的偏移

HTML 代码:
<p>Hello</p><p>2nd Paragraph</p>
jQuery 代码:
$("p:last").offset({ top: 10, left: 30 });

offset([coordinates])的更多相关文章

  1. jquery 中的 offset()

    一.语法: 1.返回偏移坐标 $(select).offset(); top:  $(select).offset().top; left:  $(select).offset().left; 2.设 ...

  2. .offset()与.position()区别

    jQuery中有两个获取元素位置的方法offset()和position(),两者的定义如下:   offset():获取匹配元素在当前视口的相对偏移.返回的对象包含两个整形属性:top 和 left ...

  3. offset()与position()的区别

    jQuery中有两个获取元素位置的方法offset()和position(),两者的定义如下: offset(): 获取匹配元素在当前视口的相对偏移. 返回的对象包含两个整形属性:top 和 left ...

  4. Python之路Day17-jQuery

    本节内容: jQuery 参考:http://jquery.cuishifeng.cn/ 模块  <==>类库 Dom/Bom/JavaScript的类库 版本:1.x   1.12 2. ...

  5. 深入学习jQuery元素尺寸和位置操作

    × 目录 [1]尺寸设置 [2]位置设置 前面的话 对于javascript来说,元素尺寸有scroll.offset.client三大属性,以及一个强大的getBoundingClientRect( ...

  6. jquery css事件编程 位置 操作

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 关于jQuery中实现放大镜效果

    1.1.1 摘要 相信大家都见过或使用过放大镜效果,甚至实现过该效果,它一般应用于放大查看商品图片,一些电商网站(例如:凡客,京东商城,阿里巴巴等)都有类似的图片查看效果. 在接下来的博文中,我们将向 ...

  8. jQuery语法介绍

    来自:http://www.cnblogs.com/ccorz/p/5803353.html jQuery类似于Python中模块的概念,是集成了javaScript和Dom的模块.大致分为两种版本1 ...

  9. jquery之css操作

    HTML示例代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. 【模板】C++高精度加法

    所谓高精度加法就是对两个和可能会超过long long数据范围的数进行加法运算.这种情况下,显然不能使用常规的方法进行运算. 那么,不妨考虑一下人在纸上是如何进行加法运算的.当人进行加法运算时,通常会 ...

  2. shell习题第15题:看数字找规律

    [题目要求] 请仔细查看如下几个数字的规律,并使用shell脚本输出后面的十个数字 10 31 53 77 105 141... ... [核心要点] 计算两个数值之间的差值 [脚本] #!/bin/ ...

  3. 安装gcc过程中遇到相互依赖的问题

    在离线安装gcc的时候需要安装一些包,但是在安装 glibc-common    glibc遇到一个很恶心的问题,这两个包相互依赖. 经查询才发现需要一起安装这两个依赖包.真是有趣的很 rpm -iv ...

  4. 刚接触neo4j 问下 neo4j 生成的节点图形可以发布为纯网页方式么

    6 回复 pangguoming 1楼•3 年前 你是想要neo4j web控制端的可视化功能吗? 那是用D3.js 做的,你用前端用D3.js配合Java自己做 或者 去下载neo4j 的前端 开源 ...

  5. Python取值的灵活性用法

    samp_string = "Whatever you are, be a good one." for i in samp_string: print(i) ,len(samp_ ...

  6. pycharm 报错 ModuleNotFoundError: No module named 'distutils.core'

    之气的虚拟机不好使了,重新装了最新版本,安装了ubuntu18.4,然后安装pycharm,但新建项目的时候报错: ModuleNotFoundError: No module named 'dist ...

  7. 数据分析基础之pandas & numpy

    一.jupyter的常用快捷键 - 插入cell: a, b   a是after从后插入  a是before 从前插入 - 删除cell: dd, x 都可以 - 修改cell的模式:m, y - t ...

  8. DX使用随记--GroupControl

    1. 创建按钮: (1)添加引用:Imports DevExpress.XtraEditors.ButtonsPanelControl (2)添加按钮语句:GroupControl1.CustomHe ...

  9. vue+element-ui upload图片上传前大小超过4m,自动压缩到指定大小,长宽

    最近项目需要实现一个需求,用户上传图片时,图片大小超过4M,长宽超过2000,需要压缩到400k,2000宽高.在git上找到一个不错的方法,把实现方法总结一下: 安装image-conversion ...

  10. java EE,java Web中的400,404,405等各种错误介绍

    4 请求失败4xx 4xx应答定义了特定服务器响应的请求失败的情况.客户端不应当在不更改请求的情况下重新尝试同一个请求.(例如,增加合适的认证信息).不过,同一个请求交给不同服务器也许就会成功. 4. ...