内容不完美的jQuery滑块

Question

我使用了滑块 http://coolcarousels.frebsite.nl/c/2/

现在我需要一些内容与滑块中的图像。如何将内容与图像放在一起。

我喜欢幻灯片

         

当我用div包装图像并向div添加内容时，它无法正常工作

我确实喜欢以下

<div id="carousel">
  <div class="wrap">
    <p>Test Content</p>
    <img src="img/building1.jpg" alt="building1" width="990" height="450" />
  </div>
  <div class="wrap">
    <p>Test Content</p>
    <img src="img/building2.jpg" alt="building2" width="990" height="450" />
  </div>
</div>

但它没有用。那么如何将内容添加到滑块。

Answer 1

您需要绝对定位要显示在图像顶部的内容。

试试这个css：

.wrap {
  position: relative;
}
.wrap img {
  display: block;
}
.wrap p {
  position: absolute;
  top: 50%;
  left: 20px;
}