javascript - jquery position没有获取到相对于父元素的偏移量 而是父元素相对于视口的偏移量
本文介绍了javascript - jquery position没有获取到相对于父元素的偏移量 而是父元素相对于视口的偏移量的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
rt:jquery的position()方法获取的是父元素相对于视口的偏移量 这是为何 不是获取相对于父元素的偏移量么?
css代码:
.wrapper {
width:300px;
height:200px;
background: #5bc0de;
margin: 0 auto;
/*padding-top:1px;*/
/*border:1px solid transparent;*/
overflow: hidden;
}
.wrapper .btn {
width:80px;
height: 35px;
line-height: 35px;
text-align: center;
border:1px solid #fff;
margin:0 auto;
background: #efefef;
color:#d9543f;
margin-top:40px;
cursor: pointer;
}
html代码:
<div class="wrapper">
<div class="btn">click</div>
</div>
js代码:
$(".btn").click(function(e) {
var off = $(this).offset();
console.log(off);
var pos = $(this).position();
console.log(pos);
// console.log("left : "+pos.left);
// console.log("top : "+pos.top);
})
浏览器上的效果:
解决方案
position()
方法是相对于 offsetParent
而言,offsetParent
指所有父级元素中距离最近的定位元素(relative
or absolute
)。
.wrapper { position: relative;}
Run test agin!
这篇关于javascript - jquery position没有获取到相对于父元素的偏移量 而是父元素相对于视口的偏移量的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文