jQuery: show () и slideDown () - различное влияние на $ (document) .height ()!

Question

Это странно.У меня есть div.Это установлено с display: none.

Если я использую $('#id').show();, то $(document).height() обновляется с высотой # id.

Однако, если я использую $('#id').slideDown();, $(document).height() остается неизменным.

Если вы хотите проверить это, попробуйте следующее:

console.log("before",$(document).height());
$('#id').show(); //slideDown();
console.log("after",$(document).height());

Может ли jQuery Master (jQM) объяснить это, пожалуйста?:) [Кстати, я использую Firefox 9.0.1.]

Answer 1

Вам нужно будет дождаться завершения анимации slideDown(), прежде чем измерять высоту.Вызов функции slideDown() завершается немедленно (в этот момент я предполагаю, что вы измерили высоту документа), но анимация только началась, поэтому элемент едва изменился, если вообще изменил высоту.Все, что делает метод slideDown, - это запускает анимацию (которая с течением времени запускается по таймеру).Итак, что вы, вероятно, делаете, это измеряете высоту сразу после запуска анимации, задолго до того, как она будет сделана.

Если вы хотите измерить высоту документа после завершения анимации slideDown(), тогда вам нужносделать это из функции обратного вызова завершения (которая сигнализирует о завершении анимации), например:

console.log("before",$(document).height());
$('#id').slideDown(function() {
    console.log("after",$(document).height());
});