博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery操作元素的位置
阅读量:6160 次
发布时间:2019-06-21

本文共 1445 字,大约阅读时间需要 4 分钟。

.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);

转载于:https://www.cnblogs.com/nmxs/p/4892412.html

你可能感兴趣的文章
insert select带来的问题
查看>>
EasyUI 添加tab页(iframe方式)
查看>>
mysqldump主要参数探究
查看>>
好记心不如烂笔头,ssh登录 The authenticity of host 192.168.0.xxx can't be established. 的问题...
查看>>
使用addChildViewController手动控制UIViewController的切换
查看>>
Android Fragment应用实战
查看>>
SQL Server查询死锁并KILL
查看>>
内存或磁盘空间不足,Microsoft Office Excel 无法再次打开或保存任何文档。 [问题点数:20分,结帖人wenyang2004]...
查看>>
委托到Lambda的进化: ()=> {} 这个lambda表达式就是一个无参数的委托及具体方法的组合体。...
查看>>
apache 伪静态 .htaccess
查看>>
unity3d 截屏
查看>>
ASP.NET MVC学习之控制器篇
查看>>
MongoDB ServerStatus返回信息
查看>>
分析jQuery源码时记录的一点感悟
查看>>
android中的textview显示汉字不能自动换行的一个解决办法
查看>>
程序局部性原理感悟
查看>>
UIView 动画进阶
查看>>
ROS机器人程序设计(原书第2版)1.4.7 在BeagleBone Black中安装rosinstall
查看>>
Spring如何处理线程并发
查看>>
linux常用命令(用户篇)
查看>>