iFrame内のhtml要素の正確な座標

Question

iFrame内に存在する可能性のあるページ上のHTML要素の絶対座標を取得する方法を教えてください。このページは、単独で呼び出されることもあり、iFrame内から呼び出されることもあります。

これは、要素のoffsetLeftとoffsetTopとoffseParentに基づいて、x、yの位置を把握するために書いた関数です。

function getXY(obj) 
{ 
var curObj = obj; 
var curLeft = curTop = 0; 

curLeft += curObj.offsetLeft 
curTop += curObj.offsetTop; 

while (curObj.offsetParent != null) 
{ 
    curObj = curObj.offsetParent;    
    curLeft += curObj.offsetLeft 
    curTop += curObj.offsetTop; 
} 
obj.x = curLeft; 
obj.y = curTop; 
} 

ページがトップですが、問題は、ページがiFrameの内から実行された場合、私はページ上のiFrameのオフセットを知っていないということである場合、これは素晴らしい作品。

ページがiFrameにあるかどうかにかかわらず、完全な座標を取得する方法はありますか？

ありがとうございます。

Answer 1

ためhttp://docs.dojocampus.org/dojo/coordsを参照してください。親iframeに到達するには、window.parentを参照する必要があります。その後、親を介して再帰的にオフセットを得ることができます。

if (window.parent && window.parent.frames && window.parent.document && window.parent.document.getElementsByTagName) { 
    var iframes = window.parent.document.getElementsByTagName("IFRAME"); 
    for (var i = 0; i < iframes.length; i++) { 
     var id = iframes[i].id || iframes[i].name || i; 
     if (window.parent.frames[id] == window) { 
      //iframes[i] is your iframe in your parent. 
     } 
    } 
} 

私はjQueryUIのための私のFrameDialogプラグインフレームを識別するためのこの技術を使用しています。

Answer 2

私はこのためにJQuery Dimensionsを使用します。 DOMを歩き、すべてのオフセットを追加するのは良い仕事です。

Answer 3

DojoやJQueryのようなJavaScriptフレームワークを使用してみてください。彼らはこのすべての基本的な機能を備えており、最新のブラウザーで一貫して動作します。道場で

：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.3/dojo/dojo.xd.js"></script> 
// box is an oject {l, t, w, h, x, y} 
// (x,y) are the absolute coordinates 
// (l,t) are the left and top offsets relative to the parent container 
box = dojo.coords(aDomObj); 

は、私はそれがあなたのために働く場合はjQueryの寸法が提案示唆し、詳細も