jquery 中的 offset()
一.语法:
1.返回偏移坐标
$(select).offset();
top: $(select).offset().top;
left: $(select).offset().left;
2.设置偏移坐标
$(select).offset({top:value,left:value});
参数的含义:
{top:value,left:value} 当设置偏移时是必需的。规定以像素为单位的 top 和 left 坐标。
3、使用函数设置偏移坐标:
$(selector).offset(function(index,currentoffset));
可选。规定返回包含 top 和 left 坐标的对象的函数。
index - 返回集合中元素的 index 位置。
currentoffset - 返回被选元素的当前坐标。
二. 实例
<!DOCTYPE html>
<html>
<head>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
名/值 对
$("button").click(function(){
$("p").offset({top:200,left:200});
});
对象
$("button").click(function(){
newPos=new Object();
newPos.left="0";
newPos.top="100";
$("p").offset(newPos);
});
函数
$("p").offset(function(n,c){
newPos=new Object();
newPos.left=c.left+100;
newPos.top=c.top+100;
return newPos;
});
});
</script>
</head>
<body>
<p style="border:1px solid red">This is a paragraph.</p>
<button>Set the offset coordinates of the p element</button>
</body>
</html>
三.注意事项
ffset() 方法 返回的top , left. 跟 margin-top,margin-left 也有关系。
如果元素有margin-top,margin-left. 它获取当前的margin. 没有则是默认取值。
如果父元素也有margin,broder 的话。它也会受到影响。取值要更大。 因为offset() 取的当前与文档的偏移坐标。
jquery 中的 offset()的更多相关文章
- 关于jQuery中的offset()和position()
在jQuery中有两个获取元素位置的方法offset()和position().position()方法是在1.2.6版本之后加入的,为什么要引 入这个方法呢?这两个方法之间有什么异同?使用的时候应该 ...
- Jquery中的offset()和position()深入剖析(元素定位)
先看看这两个方法的定义. offset(): 获取匹配元素在当前视口的相对偏移. 返回的对象包含两个整形属性:top 和 left.此方法只对可见元素有效. position(): 获取匹配元素相对父 ...
- Jquery中的offset()和position()深入剖析
jquery 中有两个获取元素位置的方法offset()和position(),这两个方法之间有什么异同?使用的时候应该注意哪些问题?什么时候使用offset(),什么时候又使用position()呢 ...
- jquery中使用offset()获得的div的left=0,top=0
写东西的时候要获取div的left和top,但怎么也取不到值都为0,但在chrome的console下是可以取到值的, 瞬间就纳闷了,于是乎就在网上找各种方法,大家一般的问题可能都是要获取的div被隐 ...
- 关于jQuery中的 offset() 和 position() 的用法
---恢复内容开始--- 在jQuery中有两个获取元素位置的方法offset()和position().position()方法是在1.2.6版本之后加入的,为什么要引入这个方法呢?这两个方法之间有 ...
- Jquery中的offset()和position()
今天遇到这个偏移量的问题,特做此记录.以便日后查看. 先看看这两个方法的定义. offset(): 获取匹配元素在当前视口的相对偏移. 返回的对象包含两个整形属性:top 和 left.此方法只对可见 ...
- 区分jquery中的offset和position
一次又一次地碰到需要获取元素位置的问题, 然后一次又一次地查offset和position的区别. 忍不了了, 这次一定得想办法记下来. position是元素相对于父元素的位置. 这个好记, par ...
- 深度理解Jquery 中 offset() 方法
参考原文:深度理解Jquery 中 offset() 方法
- js和JQuery中offset等属性对比
HTML: 内容在滚动条下面 <div id="outerDiv"> <div id="myDiv" class="myDiv&qu ...
随机推荐
- 锤子手机 Smartisan M1L 咖啡金 真皮背面 高配版 5.7
http://www.smartisan.com/m1/#/os 快人一步的OS http://www.smartisan.com/shop/#/buyphone?c=coffee&v= ...
- 【墙内备份】Android 6.0 APIs
Android 6.0 APIs In this documentSHOW MORE Fingerprint Authentication Confirm Credential App Linking ...
- android开发中的问题集锦(慢慢搬运...)
1, android 设置ExpandableListView 系统默认箭头到右边 if(android.os.Build.VERSION.SDK_INT < android.os.Build. ...
- Linux学习 :Uboot, Kernel, 根文件系统初步分析
1.U-Boot启动内核的过程可以分为两个阶段: 1)第一阶段的功能 硬件设备初始化 加载U-Boot第二阶段代码到RAM空间 设置好栈 跳转到第二阶段代码入口 2)第二阶段的功能 初始化本阶段使用的 ...
- C/C++技术常用网站
软件下载网站[visual studio 2005编译器] http://www.xdowns.com/ debug调试大牛 http://blogs.msdn.com/oldnewthing/ ht ...
- iOS常用开发资源整理
在行--专家付费咨询 杂项 App Release Checklist—iOS App发布清单. Hey Focus—帮助你专注于一个任务. Objective Cloud—Objective C A ...
- i2c之at24c08驱动及应用程序
1-->修改板级文件arch/arm/mach-s3c2440/mach-mini2440.c 步骤: ->添加引用 #include <linux/i2c.h> ->添 ...
- EXCEL里面的数字显示为文本 不用科学计数法显示
1. 在输入这一串数字前加撇号“'”(英文状态下的单引号)即可.2. 先将这一列设置为“文本”格式,然后直接输入这一串数字即可. 已经输入好了数字,那估计你这些数字的后三位都已经全变成“0”了,用 ...
- IIS下注册COM组件(转)
以Excel为例 问题描述: 检索 COM 类工厂中 CLSID 为 {00024500-0000-0000-C000-000000000046}的组件时失败,原因是出现以下错误: 80070005基 ...
- 第十一&十二&十三周周记
周数 专业学习目标 专业学习时间 新增代码量 博客发表量 人文方面的学习 知识技能总结 第十一周 认真学习网络技术,了解路由器和交换机之间的联通和使用. 一天一小时 300 一篇 每天用一小时看关于经 ...