`
- 浏览:
161070 次
- 性别:
- 来自:
成都
-
Javascript拖拽之offsetParent属性
offsetParent属性返回一个对象的引用,这个对象是距离调用offsetParent的元素最近的(在包含层次中最靠近的),并且是已进行过CSS定位的容器元素。 如果这个容器元素未进行CSS定位, 则offsetParent属性的取值为根元素的引用。 当容器元素的style.display 被设置为 "none"时(译注:IE和Opera除外),offsetParent属性 返回 null 。
句法
parentObj = element.offsetParent
变量
· parentObj 是一个元素的引用,当前元素的偏移量在其中计算。
当某个元素的父元素进行了CSS定位时(absolute或者relative),则这个元素的offsetParent属性的取值为其父元素。更确切地说,这个元素的各种偏移量计算(offsetTop、offsetLeft等)的参照物为其父元素。
当某个元素及其父元素都未进行CSS定位时(absolute或者relative),则这个元素的offsetParent属性的取值为在DOM结构层次中距离其最近,并且已进行了CSS定位的元素;如果父层次中的所有容器元素都没进行定位,则这个元素的offsetParent属性的取值为根元素。
<html>
<head>
<title>Untitled Document</title>
<script type="text/javascript" language="JavaScript">
function offset_init(){
var pElement = document.getElementById("sonObj");
parentObj = pElement.offsetParent;
alert(parentObj.tagName);
}
</script>
</head>
<body onload="offset_init()">
<div id="parent">
<p id="sonObj">测试OffsetParent属性
</div>
</body>
</html>
以上代码的Alert警告框中显示的为“BODY”。
<html>
<head>
<title>Untitled Document</title>
<style type="text/css">
#parent{
position:absolute;
<!--position:relative;-->
left:25px;
top:188px;
border:1px solid black;
}
</style>
<script type="text/javascript" language="JavaScript">
function offset_init(){
var pElement = document.getElementById("sonObj");
parentObj = pElement.offsetParent;
alert(parentObj.tagName);
}
</script>
</head>
<body onload="offset_init()">
<div id="parent">
div测试代码<p id="sonObj">测试OffsetParent属性
</div>
</body>
</html>
以上代码的Alert警告框中显示的为“DIV”。
分享到:
Global site tag (gtag.js) - Google Analytics
相关推荐
第一篇就先讲讲Javascript中的offsetParent属性吧。 支持的浏览器:Internet Explorer 4.0+,Mozilla 1.0+,Netscape 6.0+,Opera 7.0+,Safari 1.0+ element.offsetParent Summary offsetParent returns a ...
在阅读本文之前,请先看一看第一篇文章Javascript拖拽系列文章1之offsetParent属性,因为循序渐进是一个很好的习惯,值得提倡。好了,看看我们今天的内容吧。 首先让我们先看一看element.offsetLeft属性。 支持的...
JavaScript offset实现鼠标坐标获取和窗口内模块拖动 offset 即偏移量,使用 offset 系列相关属性可以 动态的 获取该元素的位置(偏移)、大小等,如: 元素距离带有定位父元素的位置 获取元素自身的大小(宽度...
HTML精确定位属性:scrollLeft,scrollWidth,clientWidth,...offsetParent 属性指定的父坐标的高度offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置offsetTop:获取对象
代码: function drag(t,p){ ... //如果没有拖动点,则拖动点默认为整个别拖动元素 function getPos(t){ var offsetLeft = 0, offsetTop = 0, offsetParent = t; while(offsetParent){ offsetLeft+=
ps:该效果用来做tr的拖动会很方便。 接着想到的是给table插入一个新tr,克隆原来的tr,并设置这个tr为fixed(ie6为absolute),例如: Code <!DOCTYPE ...
Javascript小技巧一箩筐 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcElement.releaseCapture(); 事件按键 event.keyCode ...
while(o=o.offsetParent)l+=o.offsetLeft; return l; } window.onload=function(){ var dv=$('ctrl'); dv.onmousedown=function(e){ e=e||event; isMove=true; if(isIE)this.setCapture(); oldPos.l=getL...
//鼠标拖动事件 DragZoomControl.prototype.drag_ = function(e){ var G = this.globals; if(G.draggingOn) { var pos = this.getRelPos_(e); var rect = this.getRectangle_(G.startX, G.startY, pos, G....