jquery操作元素的位置
.offset()
在匹配的元素中,获取第一个元素的当前坐标,或设置每一个元素的坐标,坐标相对于文档。
.offset() 这个不接受任何参数。
var offset = p.offset(); //获取到这个元素的位置
p.html( "left: " + offset.left + ", top: " + offset.top ); offset.left 元素距左面的距离, .offset.top 元素距上面的距离
如果元素设置的是visibility:hidden; 可以获取到坐标,
如果元素设置的是 display:none; 位置值是 undefined;
.offset(coordinates)
coordinates 一个包含top 和 left 属性的对象,用整数指明元素的新顶部和左边坐标。
.offset(function(index,coords))
返回用于设置坐标的函数。
$("p:last").offset({ top: 10, left: 30 }); 设置最后一个p元素的位置。
.offsetParent();
取得离指定元素最近的含有定位信息的元素, css position 属性是 relative absolute, 或fixed。
.offsetParent() 这个元素不接受任何参数。
$('li.item-a').offsetParent().css('background-color', 'red');
.position()
获取到匹配元素中第一个元素的当前坐标
.position() 这个方法不接受任何参数.position() 可以获取得元素相对于父元素的偏移位置。包含 top 和 left 注,不支持获取隐藏元素的便宜的坐标
var position = p.position();
$("p:last").text( "left: " + position.left + ", top: " + position.top );
.scrollLeft()
获取匹配的元素集合中第一个元素的当前水平滚动条的位置或设置每个匹配元素的水平滚动条的的距离。
.scrollLeft() 这个方法不接受任何参数。
$("p:last").text( "scrollLeft:" + p.scrollLeft() ); 获取p 元素的 横向滚动条距离。
.scrollLeft(value)
设置每一个匹配元素的水平滚动条的距离。
$("div.demo").scrollLeft(300);
.scrollTop()
获取匹配的元素集合中第一个元素的当前垂直滚动条的位置或设置每个匹配元素的垂直滚动条的距离。
.scrollTop() 这个方法不接受任何参数。
$("p:last").text( "scrollTop:" + p.scrollTop() ); 获取p 元素的垂直滚动条距离。
.scrollLeft(value)
设置每一个匹配元素的垂直滚动条的距离。
$("div.demo").scrollLeft(300);
jquery操作元素的位置的更多相关文章
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...
- jQuery入门(2)使用jQuery操作元素的属性与样式
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- 使用jQuery操作元素的属性与样式
本文学习如何使用jQuery获取和操作元素的属性和CSS样式. 元素属性和Dom属性 对于下面这样一个标签元素: <img id='img' src="1.jpg" alt= ...
- 《从零开始学习jQuery》:用jQuery操作元素的属性与样式
元素属性和Dom属性简介 对于下面这样一个标签元素: <img id='img' src="1.jpg" alt='1' class="imgs"> ...
- jQuery操作元素的属性与样式
本文学习如何使用jQuery获取和操作元素的属性和CSS样式. 元素属性和Dom属性 对于下面这样一个标签元素: <img id='img' src="1.jpg" alt= ...
- jQuar总结10:jQuery操作元素的属性
jQuery操作元素的属性 1 设置单个属性 //html <div></div> //js $('div').attr('id', 'box'); $('div').attr ...
- jQuery操作元素的class属性
今天在做一个菜单折叠插件的时候需要根据页面的url改变其class属性.jQuery操作元素的属性是非常方便的,在此记录一下: 1.给元素添加class属性: addClass(class) (1)添 ...
- JQuery操作元素的属性与样式及位置 复制代码
<script type="text/javascript" src="JQuery/jquery-1.5.1.js"></script> ...
- JQuery操作元素的属性与样式及位置
<script type="text/javascript" src="JQuery/jquery-1.5.1.js"></script> ...
随机推荐
- pat1093. Count PAT's (25)
1093. Count PAT's (25) 时间限制 120 ms 内存限制 65536 kB 代码长度限制 16000 B 判题程序 Standard 作者 CAO, Peng The strin ...
- Qt 学习(4)
Qt UI 文件机制 使用 Qt 设计界面程序时,若界面是静态的,可以借助 Qt Designer 进行所见即所得的界面设计.设计好界面后,在界面类中对 ui 对象进行操作非常方便. QtCreato ...
- jQuery Validate验证框架详解(转)
jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...
- C# .NET中自带的委托Actoin、Func详解
委托是.NET中强大的功能,而.NET为我们提供了2个非常实用的泛型委托,分别是Action.Func [Action] Action是.NET内部提供的一个无返回值.泛型的委托,有16重载,分别是0 ...
- maven课程 项目管理利器-maven 3-9 maven依赖冲突 4星
依赖相同的jar包,版本不一致,优先选择哪个版本呢? 1 路径短的优先 如A依赖B,B依赖C,C依赖commons.jar 1.0 A依赖D,D依赖commons.jar 2.0 那么优先解析2.0, ...
- Android大牛
张鸿洋 http://blog.csdn.net/lmj623565791/article/category/2680597 CSDN 鸿洋:http://blog.csdn.net/lmj62356 ...
- iview 中 select 值不对
<Select v-model="formValidate.departmentId" @on-change="selectDepartment"> ...
- JS在与lua的交互心得
最近在写一个项目,前端技术使用的是Vue,在与lua的交互过程,是通过一个公共JS,前端调用公共js的方法给lua发送命令,lua接到命令,去执行一些方法,然后又通过回调返回到了前端,由于是第一次写这 ...
- linux文件按照行数切割
公司小站的nginx服务器日志一直没有管理 到发现的时候已经有50G+的logs文件 查看起来十分不便 只能将其切割 接下来分享 具体方法 split -l 5000(行数) -a 5(增加文件名上限 ...
- ArcGIS创建要素类
在使用ARCGIS软件进行工作时,免不了要建立地理数据库和要素类之类的.一下是我创建文件地理数据库并在数据库中创建要素类写相关步骤: 1.启动软件,可以使用ARCCatalog直接进行创建也可以使用A ...