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. Darknet卷基层浅层特征可视化教程

    目录 Darknet浅层可视化教程 说明 处理步骤 使用python可视化txt文件 Darknet浅层可视化教程 说明 针对YOLO官方提供的c语言版的darknet进行了修改,添加了一些函数,进行 ...

  2. HDU 6070 Dirt Ratio(分数规划+线段树)

    http://acm.hdu.edu.cn/showproblem.php?pid=6070 题意: 找出一个区间,使得(区间内不同数的个数/区间长度)的值最小,并输出该值. 思路: 因为是要求$\f ...

  3. Linux——shell简单学习(一)

    首先来一个小程序,来查看所在目录,以及该目录下的文件 #!/bin/sh # “#!”指定用sh执行shell脚本 #this is to show workstation # “#” 表示注释 ec ...

  4. wc的使用

    统计文件个数 ls -l |grep "^-"|wc -l 统计目录的个数 ls -l|grep "^d"|wc -l 统计文件个数(包括子文件夹) ls -l ...

  5. Spring/Spring MVC/Spring Boot的区别

    1.spring boot更简单,容易上手: 2.spring boot对第三方技术进行了很好的封装,提供了大量的第三方接口: 3.通过依赖配置,不需要XML等配置文件: 4.提供了安全性等特性. S ...

  6. MVC修改视图的默认路径

    概述:之前MVC5和之前的版本中,我们要想对View文件的路径进行控制的话,则必须要对IViewEngine接口的FindPartialView或FindView方法进行重写,所有的视图引擎都继承于该 ...

  7. ASCII 可打印字符与控制字符

    2017-08-16 21:29:30 基本的 ASCII 字符集共有 128 个字符,其中有 95 个可打印字符,包括常用的字母.数字.标点符号等,另外还有 33 个控制字符.标准 ASCII 码使 ...

  8. [Java学习] JSON工具学习记录--FastJSON

    最近做项目,总是与json打交道,在用了即可json工具后,个人认为fastJson最好用,很方便,API也清晰可见,所以记录下使用方法,给需要的人提供帮助.(部分摘抄自网络) 一.API入口 Fas ...

  9. English trip -- VC(情景课)1 C What's your name?

    Grammar focus 语法点 What's your name? What's his name? What her name? My name is Angela. His name is K ...

  10. 12月10日 render( locals:{...}) 传入本地变量。

    Jdstor第一部分后台设计,4-4上传图片. 3.4 Using Partials--3.4.4 Passing Local Variables You can also pass local va ...