HTMLボタンや画像の座標をブラウザで見つける方法は？

Question

あり の勝利が発表されたが、何のコードが掲載されなかったところcomp.lang.javascriptで、この上のスレッドが最近だった：

のHTMLページでは、要素（画像やボタンの左下隅の座標を見つけるのですか、） は、ブラウザやページスタイルを問わず信頼性がありますか？ 「Ajax in Action」（私が持っているコピー）で提唱されている方法は、ある状況下ではIEで動作しないようです。問題を簡単にするために、グローバルドキュメントスタイルを "伝統的"または "過渡的"なものに設定できると仮定しましょう。

すべてのブラウザで機能する完全な機能のコードまたはコードを提供してください - 「簡単です」と言って、DOMを走査するものについてはじめるのではなく、私はcomp.lang.javascriptに戻るでしょう。これが繰り返されているのであれば私に叱責してください。私はそれを見つけようとしました。

Answer 1

、JQueryを使用している仕事に、このようなものを取得する唯一の確実な方法を（恐れることはありません。 、それはあなたがインクルードしなければならない外部スクリプトファイルです）。そして、あなたは私がこれまで出会った任意およびすべてのブラウザ間で良好に動作している、現在の座標を取得するために

$('#element').position() 

または

$('#element').offset() 

のようなステートメントを使用することができます。

Answer 2

これを試してみてください：jQueryので

var elm = document.getElementById('foo'); 
var point = {x:0,y:elm.offsetHeight}; // Change to y:0 to get the top-left 

while (elm) 
{ 
    // This will get you the position relative to the absolute container, 
    // which is what you need for positioning an element within it 
    if (elm.style.position == 'absolute') 
     break; 

    point.x += elm.offsetLeft; 
    point.y += elm.offsetTop; 

    elm = elm.offsetParent; 
} 

Answer 3

：私の経験で

var jq = $('#yourElement'); 
var position = jq.offset(); 
alert('x: ' + position.left + ', y: ' + position.top); 

var bottomLeftPixelPosition = 
    { left: position.left, top: position.top + jq.height() - 1; }; 

Answer 4

私はこれを使用しており、IEとFirefoxの両方で動作します。

 
var Target = document.getElementById('SomeID'); 
var Pos = findPos(Target); 

AnotherObj = document.getElementById('AnotherID'); 
AnotherObj .style.top = Pos[1] + "px"; 
AnotherObj .style.left = Pos[0] + "px"; 

//------------------------------------ 
function findPos(obj) { 
//---------------------------------------- 
    var curleft = curtop = 0; 
    if (obj.offsetParent) { 
    do { 
      curleft += obj.offsetLeft; 
      curtop += obj.offsetTop; 
    } while (obj = obj.offsetParent); 
    return [curleft,curtop]; 
    } 
} 

Answer 5

私はこの解決策をウェブから見つけました...これは完全に解決しました。 このリンク先を確認してください。 （あまりにも他の人ホープ）のFirefox、IE8で完璧 http://www.quirksmode.org/js/findpos.html

/** This script finds the real position, 
* so if you resize the page and run the script again, 
* it points to the correct new position of the element. 
*/ 
function findPos(obj){ 
    var curleft = 0; 
    var curtop = 0; 

    if (obj.offsetParent) { 
     do { 
     curleft += obj.offsetLeft; 
     curtop += obj.offsetTop; 
     } while (obj = obj.offsetParent); 

     return {X:curleft,Y:curtop}; 
    } 
} 

作品、オペラ知識を共有する人に おかげで... よろしく、

無力性