jquery - 在 jQuery 中轻松地将一个元素定位在另一个元素上？

Question

我需要使用 jQuery 将 div 放置在图像上。我可以使用 position:fixed 创建它，并使用顶部和左侧使用元素偏移来定位它，但它很糟糕，因为如果用户滚动，该元素将不会位于该元素的顶部。

还有其他想法吗？

Answer 1

如果您要在多个地方执行此操作，则可以执行以下操作:

<div style="position: relative;">
  <div style="position:absolute; width: 276px; height: 110px; z-index: 2;">
    Content here will be on top the image
  </div>
  <img style="width: 276px; height: 110px;" src='http://www.google.com/intl/en_ALL/images/logo.gif' alt="Test Img" />
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

如果您匹配 height/width内部/外部 div 上的样式属性，内部 <div>出现在 <img /> 之前你给内心<div>比图像更高的 z-index，它将完美地重叠图像。

您可以在此处查看实际操作的示例:http://jsfiddle.net/ZcBus/