javascript - 将文本/标题添加到缩略图 slider

Question

我需要为每张图片添加说明。但标题需要位于 slider 旁边的灰色框中。你可以在这里看到这个想法的一个例子: http://pagedev.co.uk/richmond/show-open.html

基本上每张图片都需要有标题、布面油画和尺寸标签。但它需要随着每张图片而改变。

希望有人能帮助我。您应该可以使用上面的链接检查代码，但如果您需要任何信息，请告诉我，我会张贴出来。

提前谢谢你。

李

Answer 1

我无法测试这个，因为我没有你所有的图片，但我想这就是你想要的:)

<div class="col span_9_of_12">
<div id="slider" class="flexslider">
<ul class="slides">
<li>
<img src="images/large1.jpg" />
<div class="painting-description">
<p><strong>The Heart of Suffolk</strong></p>
<p>(on a typically rainy day) 1965</p>
<p>Oil on canvas</p>
<p>28 x 34 inches</p>
</div>
</li>
<li>
<img src="images/large2.jpg" />
<div class="painting-description">
<p><strong>The Heart of Suffolk</strong></p>
<p>(on a typically rainy day) 1965</p>
<p>Oil on canvas</p>
<p>28 x 34 inches</p>
</div>
</li>
<li>
<img src="images/large3.jpg" />
<div class="painting-description">
<p><strong>The Heart of Suffolk</strong></p>
<p>(on a typically rainy day) 1965</p>
<p>Oil on canvas</p>
<p>28 x 34 inches</p>
</div>
</li>
<li>
<img src="images/large4.jpg" />
<div class="painting-description">
<p><strong>The Heart of Suffolk</strong></p>
<p>(on a typically rainy day) 1965</p>
<p>Oil on canvas</p>
<p>28 x 34 inches</p>
</div>
</li>
<li>
<img src="images/large5.jpg" />
<div class="painting-description">
<p><strong>The Heart of Suffolk</strong></p>
<p>(on a typically rainy day) 1965</p>
<p>Oil on canvas</p>
<p>28 x 34 inches</p>
</div>
</li>
<li>
<img src="images/large6.jpg" />
<div class="painting-description">
<p><strong>The Heart of Suffolk</strong></p>
<p>(on a typically rainy day) 1965</p>
<p>Oil on canvas</p>
<p>28 x 34 inches</p>
</div>
</li>
</ul>
</div>
</div>