JQuery .animate() полная функция, выполняемая до завершения

Question

Существует контейнер div (#content) с заполнением 10px и его content (#inner_content). Я загружаю некоторые новые вещи через ajax (новый html содержит все в #inner_content div) и заменяет # content's html новым html.

Выполняя это, я хочу, чтобы высота контейнера div (#content) настраивалась на высоту нового контента путем анимации. Таким образом, я установил переполнение: скрытый для контейнера div, и когда я загружаю новый контент, я получаю его высоту и анимацию div контейнера на одну и ту же высоту. Все хорошо ожидать, что иногда высота несколько больше (10-20 pixels возможно), чем нужно, и это вызывает проблемы с дизайном.

Таким образом, я положил полную функцию на .animate(), чтобы установить высоту контейнера div на '' (auto) после завершения анимации, чтобы высота была правильной. Проблема в том, что полная функция запускается немедленно, анимация пропускается, и высота автоматически становится автоматически. Вот код:

$("#content").html(response); 
$("#content").animate({height: $("#inner_content").height()+"px"}, 300, function() { 
$("#content").css({height: ''}); 
}); 

Как решить эту проблему? Мне нужна анимация, которую нужно выполнить, тогда высота будет установлена ​​автоматически (это приводит к небольшому «пробелу» в процессе, потому что div сразу получает 10-20px короче, но все в порядке.

Answer 1

Хмм, без какого-либо исходного кода это сложно, но мой инстинкт кишки говорит, по какой-то причине, ваши #content и #inner_content дивы фактически та же высота (я предполагаю, 0), которая вызывает анимацию выполнить мгновенно, таким образом, выпустив событие сразу же, как хорошо.

Можете ли вы предоставить какой-либо источник?

Я бы порекомендовал сначала сыграть с методом outerHeight() по разделам и посмотреть, что произойдет. Кроме того, попробуйте отключить overflow: hidden и вместо того, чтобы попробовать следующий псевдокод:

1. Загрузите новое содержание в скрытом отдельном div
2. Получить высоту нового контента
3. Анимирует текущее содержание
4. Update текущее содержимое с новым содержанием