具有固定高度的JQUERY，div (带有滚动条)如何动画，直到它不再需要滚动条？

Question

具有固定高度的JQUERY，div (带有滚动条)如何动画，直到它不再需要滚动条？

我在一个页面上有一个div，它的CSS height:200px设置使DIV有一个垂直滚动条，允许用户滚动一串文本。

我想让DIV动画来扩展高度，直到显示div中的所有内容，这意味着没有更多的滚动条

我尝试了以下几种方法：

$("#view-container").animate({"height": "auto"}, "slow");

但这并不起作用，而这个却起作用了：

$("#view-container").animate({"height": "1000px"}, "slow");

问题是DIV中的文本大小是可变的。想法？

谢谢

Answer 1

您可以执行的操作：

将height设置为auto，然后录制offsetHeight。立即将高度更改为原来的高度-用户根本看不到更改，因为浏览器是单线程的。

然后使用jQuery (或不使用)将动画设置为记录的高度。

示例：

var vc = document.getElementById('view-container');
var vcold = vc.style.height;
vc.style.height = 'auto';
var vcheight = vc.offsetHeight;
vc.style.height = vcold;
$("#view-container").animate({"height": vcheight + "px"}, "slow");