具有绝对位置的图像堆

Question

我创建了一堆图片，您可以点击这些图片。通过单击顶部图像，它会将 z-index 向后移动图像的数量。这些图像需要有一个共同的描述。如果我把 position:absolute 放在它们上面（堆叠它们）。描述也被堆叠起来。有没有办法让它们保持在图像下方？

.image-pile {
    position: relative;
}

.images img {
    position: absolute;
    width:300px;
}

Answer 1

.image-pile 没有高度，因为内容是绝对定位的。通过计算 javascript.

中的高度来修复它

var imgheight = $( ".images img" ).innerHeight()

$('.images').css('height', imgheight)

Image pile with position absolute