基於窗口寬度的Div垂直位置

Question

我有一個圖像，我已經設置爲調整窗口寬度的100％。

我有一個文本div，我想定位在該圖像的某個部分（因此它是可讀的）。

因爲圖像的高度隨着寬度的變化而變化，所以我需要文本的div上下移動，以便它保持在圖像的特定部分上。

有沒有辦法自動調整div的垂直位置？

謝謝。

Answer 1

假設HTML是：

<div class="container"> 
<div id="image"><img src="abc.png" /></div> 
<div id="text">some text</div> 
</div> 

您將添加下列jQuery腳本把文本始終圖像層內部：

$(document).ready(function(){ 
    putInsideImage(); 
}); 
function putInsideImage(){ 
var h = $("#image").innerHeight(); 
var w = $("#image").innerWidth(); 
$("#text").css({"margin-top":-(h/2) + "px", "margin-left": (w/2) + "px"}); 
}