jquery - 将高度动画到新内容的高度答案

【问题标题】：jquery - animate height to the new content's heightjquery - 将高度动画到新内容的高度
【发布时间】：2014-08-23 00:17:12
【问题描述】：

我有一个div 和height = 40 px。我在其中加载了一个可能具有随机内容高度的 html 字符串。

我正在尝试将容器的高度设置为新内容的高度（根据jQuery animate height to auto）：

var jqObj = $('<div/>').html($.parseHTML(htmlString)).hide();

$('.mainCont').html(jqObj.html());
jqObj.fadeIn('slow');

var height = $('.mainCont').css('height', 'auto').height(); // get real height
$('.mainCont').animate({height: height+'px'}, 2000);

但我没有看到任何动画，只能单次跳转到所需的高度。如何解决？

编辑

我看到$('.mainCont').css('height', 'auto').height() 造成了这种情况。但是没有它我无法获得新内容的高度

【问题讨论】：

标签： javascript jquery

【解决方案1】：

jQuery 只能为数字设置动画，但是您将样式高度设置为 auto 然后您尝试将其设置为整数，而 jQuery 不知道如何根据字符串 auto 设置动画没有任何意义。

在动画之前将高度设置为一个数字

$('.mainCont').css('height', '0px').animate({height: height}, 2000);

我已经将它设置为零，我猜你想要的不是你得到的数字，否则你是从当前高度动画到当前高度，这意味着没有运动。

【讨论】：