使用jQuery（扩展它）动画div高度时出现意外结果？

Question

如果您点击了更多链接，我做了一个扩展div的切换：

$(".user-review-toggle").toggle(function(){
    // Change the height of the element to auto so we can get that value, and use it in our expanding animation.
    var currentUserReview = $(this).prev('.user-review');
    currentUserReview.css('height', 'auto');
    var calculatedHeight = currentUserReview.height();

    $(this).css("display", "none");
    $(this).css("backgroundPosition", "0 -12px");
    currentUserReview.animate({height: calculatedHeight}, 0, function () {
        $(this).css("overflow", "visible");
        $(this).css("line-height", "140%"); // Change it back to the original value
    });

文本折叠时div的高度：

.has-photo .user-contribution .user-review, .has-review .user-contribution .user-review {
height: 98px;
}

它首先暂时将div的高度设置为auto，以便它可以存储其原始大小。然后它将div的高度设置为该高度。

现在的问题是，当有很多字符时它会过度扩展，而当存在太多字符时，它不会扩展得足够多。在文本旁边放置一个图像也会使最终结果有点意外（正如你在屏幕截图中看到的那样）：

已折叠：

展开： 有什么建议可以解决这个问题吗？

Answer 1

你是否正在设置＆amp;高度到你的图像？试着这样做。未加载图像时，它们根本不使用任何空间。尝试设置图像的尺寸。 希望有所帮助。