扩展子元素周围的div（没有包装）

Question

从我所看到的这不可能没有javascript。我有一系列父div内的图像。图像几乎限于一种尺寸。我希望父div使用图像扩展或缩小。现在它切断了图像 - 我认为因为溢出：隐藏;

如果你看看firebug，这就是ID：

<div id="zt-container" class="zt-container">

<http://www.zakweinberg.com/imagezoomtour>

我尝试了百分比并移除了高度div。

CSS是最好的。如果没有，我会接受javascript。

感谢任何帮助。

Answer 1

由于您的img.zt-current元素为position:absolute，因此您的.zt-item div的高度为0。最重要的是，height: 450px div上有.zt-container。如果取下图像上的绝对定位以及容器上的固定高度，容器将展开以适合图像。问题是，当它们进行动画过渡时，它会扩展显示图像，这可能是您不想要的。

如果你想保留动画过渡，你可能需要使用javascript更改.zt-container div的高度。获取图像的高度，并使用它来设置容器的高度。类似的东西：

$('.zt-container').animate({
    height: $('img.zt-current').height()
});

这看起来与您想要的类似：http://css-tricks.com/snippets/jquery/animate-heightwidth-to-auto/

Answer 2

我检查了mozilla中的链接。 问题仅在于第二张图片。

为图片添加宽度：100％，这将适合div。