基于窗口宽度的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"}); 
}