Jquery .position和offset区别

最新推荐文章于 2023-06-17 13:46:15 发布

liu__software

最新推荐文章于 2023-06-17 13:46:15 发布

阅读量241

点赞数

分类专栏： jquery 文章标签： js

原文链接：https://blog.csdn.net/hlx20080808/article/details/85619420

版权

jquery 专栏收录该内容

22 篇文章 0 订阅

订阅专栏

说明：

position()获取相对于它最近的具有相对位置(position:relative)的父级元素的距离，
如果找不到这样的元素，则返回相对于浏览器的距离。

offset()始终返回相对于浏览器文档的距离，它会忽略外层元素

1》jQuery中offset()方法:获取或设置指定元素在视窗或文章的偏移位置;

语法：$(selector).offset(value)

注：它的value为两个值一个为left一个为top

2》jQuery中position()方法可以取得元素相对于父元素的偏移位置。

语法：$(selector).position(value)

注：它的value为两个值一个为left一个为top

案例：

<head>
       <meta charset="UTF-8">
       <title></title>
       <style>
           #outer {
               width: 200px;
               position: relative; /*相对位置*/
               left: 200px;
               background: bisque;
               height: 200px;
           }

           #inner {
               width: 100%;
               height: 50px;
               position: absolute; /*绝对位置*/
               left: 50px;
               top: 60px;
               background: chocolate;
           }
       </style>

   </head>

   <body>
       <div id="outer">

           <div id="inner">
           </div>
       </div>
   </body>

</html>

position()

offset()

————————————————
版权声明：本文为CSDN博主「凌冰_」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/hlx20080808/article/details/85619420

liu__software

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Jquery .position和offset区别

说明：position()获取相对于它最近的具有相对位置(position:relative)的父级元素的距离，如果找不到这样的元素，则返回相对于浏览器的距离。offset()始终返回相对于浏览器文档的距离，它会忽略外层元素1》jQuery中offset()方法:获取或设置指定元素在视窗或文章的偏移位置;语法：$(selector).offset(...
复制链接

扫一扫

专栏目录