Question

我正在创建一个新闻页面，文章正坐在覆盖框中的图像上。我有一个打印在页面上的多个新闻项目正在与一个scoller一起工作。

我对中心感兴趣的是figcaption。

        <section>
            <h2>{title}</h2>
            <figure>
                <img src="{news_image}" alt="{title}" width="718" />
                <figcaption>
                    {article}
                    <a href="#close" class="btn-close">X</a>
                </figcaption>
            </figure>
        </section> 
        <section>
            <h2>{title}</h2>
            <figure>
                <img src="{news_image}" alt="{title}" width="718" />
                <figcaption>
                    {article}
                    <a href="#close" class="btn-close">X</a>
                </figcaption>
            </figure>
        </section> e.t.c

我想获得图中每个img的高度以及每个figcaption的高度，以便我可以将它完美地放在图像上。

有一个元素，我可以想象它很容易，但对我来说，混乱是如何让Jquery为每个元素添加正确的值。

有什么想法吗？

Answer 1

你应该能够通过迭代每个部分来做到这一点：

$('section').each(function(){
    var imgHeight = $(this).find('img').height();
    var captionHeight = $(this).find('figcaption').height();
    {position caption here}
});

这应该可以让你抓住每个图像的高度和每个部分中的每个标题。

jsFiddle这里：http://jsfiddle.net/nQCUr/1/

获取高度值并使用多个不同高度的元素定位在中心

1 个答案: