動畫后的自適應自動高度容器

Question

我通過javascript更改了元素的高度（無法通過css從0更改為自動）。

/* Function to animate height: auto */
function autoHeightAnimate(element, time){
    var curHeight = element.height(), // Get Default Height
        autoHeight = element.css('height', 'auto').height(); // Get Auto Height
          element.height(curHeight); // Reset to Default Height
          element.stop().animate({ height: autoHeight }, time); // Animate to Auto Height
}

調整Chrome窗口的大小后，該元素不會自動更改其高度，因為僅在單擊標簽之一后它才會更改。 演示在這里。

是否有可能通過CSS做到這一點？ 如果沒有，在縮放瀏覽器窗口后如何通過javascript / jQuery進行更改？

Answer 1

在這種情況下，您可以使用from調整大小功能並在調整大小發生時設置高度，如下所示：

$( window ).resize(function() {
      autoHeightAnimate('','');
});