您的位置：首页 > 运维架构

获取元素在页面中left,top值(忽略其父级的定位)

2016-01-03 22:05 316 查看
函数用到的属性有:

element.offsetLeft返回当前元素的相对水平偏移位置的偏移容器
element.offsetParent返回元素的偏移容器
element.offsetTop返回当前元素的相对垂直偏移位置的偏移容器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
body { margin: 0; padding: 0;}
div { padding: 10px; }
#div1 { background-color: #006FDF; position: relative;}
#div2 { background-color: #00A881; position: relative;}
#div3 { background-color: #FFCC33; position: relative;}
</style>
</head>
<body>
<div id="div1">
<div id="div2">
<div id="div3">

</div>
</div>
</div>
<script>

var oDiv = document.getElementById('div3');

var p = getPos(oDiv);
alert(p.left);

//获取元素在页面中left,top值(忽略其父级的定位)
function getPos(obj){
var pos = {left:0, top:0};

while(obj){
pos.left += obj.offsetLeft;
pos.top += obj.offsetTop;
obj = obj.offsetParent;
}
return pos;
}

</script>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航