如何獲取計算機屏幕上元素的像素座標

Question

我想知道屏幕上html元素的左側和頂部位置。 我試着用這個代碼，給了我一個元素的文檔內的位置：

var position = $('#elem').position(); 

，但我要的是知道是否有是發現在屏幕上的位置，或者如果有一個函數方式知道屏幕上這一點的座標：

先謝謝了！

Answer 1

使用offset api

獲取所述第一元件的當前座標，或設置的每個元件的座標，在所述一組匹配的元素，相對於文檔的。

代替position座標是相對父元素

Answer 2

，你需要定義你想找到topleft

檢查文檔Position

var position = $('#elem').position(); 
alert(position.left + ' ' + position.top) 

Answer 3

您可能正在尋找Element.getBoundingClientRect()什麼現在的位置。

返回值是一個TextRectangle對象，其中包含只讀 左，上，描述了 像素的邊界框右側和底部性質。頂部和左側相對於視口的左上角。

例如，這不是網頁上滾動的問題因素的結果：

document.querySelector("#question").getBoundingClientRect() 

{ 
    "height": 633, 
    "width": 728, 
    "left": 431.5, 
    "bottom": 844, 
    "right": 1159.5, 
    "top": 211 
} 

，有點滾動：

{ 
    "height": 633, 
    "width": 728, 
    "left": 431.5, 
    "bottom": 10, 
    "right": 1159.5, 
    "top": -623 
}