jQuery - анимация переполнения?

Question

Как я могу использовать jQuery для анимации переполнения div?
Обычно, если я хочу анимировать элемент div, я бы использовал что-то вроде этого:

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

И это прекрасно работает!но если содержимое div превышает 200px, оно обрезается до 200px
, есть ли способ сохранить анимацию до конца содержимого?

Answer 1

Вы можете спросить <div>, какой рост он хочет получить, запросив его scrollHeight, а затем анимировать до этой высоты вместо фиксированной высоты:

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/