动画溢出

Question

如何使用jQuery动画div溢出?
通常，如果我想让一个div元素动画化，我会使用这样的代码:

$("div").animate({height: 200}, "slow");

效果很好!但是，如果div的内容超过200px，内容将在200px处被截断
是否有办法保持动画运行，直到内容结束?

Answer 1

你可以通过请求scrollHeight来询问<div>它想要多高，然后动画到那个高度，而不是固定的高度:

var height = $('div').prop('scrollHeight');
$('div').animate({ height: height }, 'slow');

演示:http://jsfiddle.net/ambiguous/WBcME/

Answer 2

给你:

<div style="border: 1px solid; min-height: 400px;">
    hi<br>
    Here's some content<br>
    Here's some more
</div>

Javascript:

$("div").animate({minHeight: '1px',  }, "slow");

我不认为它会在IE6中工作-但是谁用它呢，嗯?

这里是jsFiddle: http://jsfiddle.net/jameszaghini/SCJpZ/