獲取圖像相對於父級的位置，考慮垂直偏移量

我在HTML中有兩個相鄰的圖像。一個圖像比另一個高。圖片有一個vertical-align: middle CSS屬性。這會使較短的圖像相對於父容器放置較低的圖像。獲取圖像相對於父級的位置，考慮垂直偏移量

我使用jQuery .position()方法來獲取圖像的位置。這兩個圖像的position.top是相同的，當清晰地顯示由於vertical-align: middle CSS屬性，較短的圖像進一步向底部偏移。

我怎樣才能得到圖像的實際位置，考慮到由vertical-align: middle CSS屬性造成的垂直差異？

UPDATE：

的問題是因爲我做到以下幾點：

我的HTML是與不具有SRC屬性的圖像輸出。他們的寬度和高度，所以瀏覽器不應該需要計算其位置
我設置每個圖像的src屬性
我檢查使用的位置之前等待負載的實際圖像（後面的步驟） jQuery的。我的猜測是，瀏覽器（FF 9.0.1）等待更新其位置，使之前加載圖像提供給JS

我將需要重新設計我的應用程序，以便不會發生這種情況

來源

2012-01-29 Krystian Cybulski

您可以顯示HTML，jQuery和CSS？ – j08691 2012-01-29 21:55:33

我的問題似乎並不那麼直截了當。我剛開始設置一個我正在體驗的行爲的簡單演示，並且在最簡單的情況下，兩個圖像的位置正在被正確地返回。進一步研究... – 2012-01-29 22:04:30

試試這個。

http://jsfiddle.net/cadence96/X54gy/

small = parseInt($('img:eq(0)').css('height')); 
big = parseInt($('img:eq(1)').css('height')); 

difference = big - small; 
top_distance = difference/2; 

alert(top_distance);

來源

2012-01-29 22:10:42

只需得到高度爲div的高度，從div的高度減去該高度，然後除以2.這會給你與父母div的偏移量。

來源

2012-01-29 22:04:43 maxedison

using jquery.offset會給你它相對於全身的實際位置。如果你只是想要它相對於它的父母，你可以寫一個腳本，

function findPos(obj,till){ 
    var curleft = curtop = 0; 
    curleft += obj.offsetLeft; 
    curtop += obj.offsetTop; 
    return [curleft,curtop]; 
}

來源

2012-01-29 22:05:10 japrescott

獲取圖像相對於父級的位置，考慮垂直偏移量

回答

相關問題