JQueryを使用しないタグの左上隅を取得するには？

Question

JQueryを使用していないタグの左上隅を取得するには？

Answer 1

element.offsetLeftとelement.offsetTopはあなたにトップのletコーナーを取得する、その親に関連

function top(el) { 
    var topVal = el.offsetTop; 
    if (el.parentNode) topVal+= top(el.parentNode); 
    return topVal; 
} 

function left(el) { 
    var leftVal = el.offsetLeft; 
    if (el.parentNode) leftVal+= left(el.parentNode); 
    return leftVal; 
} 

あなたがdocummentを打つまでに比べてあなたにそれを取得します（document.parentNodeがnullで、rescursionを終了）再帰的にアップし、それを呼び出しますドキュメント全体これがiframeまたはそれ自身のドキュメントを持つ他のものと互換性がないことに注意してください。

[編集]

上記の再帰関数があまりにもナイーブであり、唯一の非常にシンプルなページで動作します。代わりにoffsetParentを反復処理できますが、それによってもいくつかの問題が発生します。

このソリューションは、合理的に動作しているようですが、私はその親との相対位置を取得するには

Retrieve the position (X,Y) of an HTML element

Answer 2

徹底的に自分自身をそれをテストhavnt、この使用：

function getRelativePos(el) { 
    var left=el.offsetX; 
    var top=el.offsetY; 
    return {top:top,left:left}; 
} 

そして今、あなたができるのこのように使用して、左の位置に警告します：

var myElement=document.getElementById('myel'); 
alert(getRelativePos(myElement).left); 

function getAbsPos(el) { 
    var rect=el.getBoundingClientRect(); 
    return {top:rect.top,left:rect.left}; 
} 

あなただけのgetRelativePos関数のようにそれを使用することができます：あなたは絶対位置をしたい場合はが、これは使用しています。