1、拖动后记录x,y值
给div加上mousePosition事件
function mousePosition(evt){
evt = evt || windowevent;
return {
x : evtclientX + documentbodyscrollLeft - documentbodyclientLeft,
y : evtclientY + documentbodyscrollTop - documentbodyclientTop
}
}
2、打开页面div定位
$(“div”)attr("top",y)attr("left",x);
扩展资料
在用js获取元素的位置之前,元素在页面的位置的计算公式,如下:
元素在页面的位置=此元素相对浏览器视窗的位置+浏览器滚动条的值;
用getBoundingClientRect()方法来获得某个元素相对浏览器视窗的位置 {这个方法返回的是一个对象,即Object,该对象具有4个属性:top,left,right,bottom }。
<html >
<head>
<meta >
<title>Demo</title>
</head>
<body style="width:2000px; height:1000px;">
<div id="demo" style="position:absolute; left:518px; right:100px; width:500px; height:500px;
background:#CC0000; top: 114px;">Demo为了方便就直接用绝对定位的元素</div>
</body>
</html>
<script>
documentgetElementById('demo')onclick=function (){
if (documentdocumentElementgetBoundingClientRect) {
alert("left:"+thisgetBoundingClientRect()left)
alert("top:"+thisgetBoundingClientRect()top)
alert("right:"+thisgetBoundingClientRect()right)
alert("bottom:"+thisgetBoundingClientRect()bottom)
var X= thisgetBoundingClientRect()left+documentdocumentElementscrollLeft;
var Y = thisgetBoundingClientRect()top+documentdocumentElementscrollTop;
alert("Demo的位置是X:"+X+";Y:"+Y)
}
}
</script>
你是想获取a标签?documentgetElementById("href4");就可以,如果获取不到,有可能是你js有问题,把js其他贴出来看一看,或者试一下下面的代码:<a href="#" id="testa">test</a>
<script type="text/javascript">
windowonload=function(){
alert(documentgetElementById("testa"));
}
</script>
objclientWidth //获取元素的宽度
objclientHeight //元素的高度
objoffsetLeft //元素相对于父元素的left
objoffsetTop //元素相对于父元素的top
objoffsetWidth //元素的宽度
objoffsetHeight //元素的高度
区别:
clientWidth = width + padding
clientHeight = height + padding
offsetWidth = width + padding + border
offsetHeight = width + padding + border
offset比client多了border的宽度
//获取元素的纵坐标(相对于窗口)
function getTop(e){
var offset=eoffsetTop;
if(eoffsetParent!=null) offset+=getTop(eoffsetParent);
return offset;
}
//获取元素的横坐标(相对于窗口)
function getLeft(e){
var offset=eoffsetLeft;
if(eoffsetParent!=null) offset+=getLeft(eoffsetParent);
return offset;
}
//获取元素的纵坐标(相对于窗口)
function getTop(e){
var offset=eoffsetTop;
if(eoffsetParent!=null) offset+=getTop(eoffsetParent);
return offset;
}
//获取元素的横坐标(相对于窗口)
function getLeft(e){
var offset=eoffsetLeft;
if(eoffsetParent!=null) offset+=getLeft(eoffsetParent);
return offset;
}
现在我有个窗口坐标X,Y 如何利用JS点击该坐标
>
以上就是关于js获取div到body左侧距离全部的内容,包括:js获取div到body左侧距离、js获取元素、JS如何判断元素相对于父窗口的绝对位置等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)