Добавление и удаление контента в jQuery

Question

Если я создаю функцию с jQuery, которая добавляет пустой div, выполняет некоторую анимацию внутри пустого пространства, созданного div, а затем удаляет div, браузер никогда не освобождает место для пустого div (высота и ширина задаются).

Если я не удаляю пустой div в своей функции, то браузер создаст необходимое пространство, и все будет работать правильно. Однако мне действительно нужно удалить пустое пространство, созданное div, когда анимация будет завершена.

Есть ли способ поставить в очередь удаление div, чтобы браузер показал желаемое поведение?

Answer 1

Некоторые эффекты jQuery имеют обратные вызовы, которые запускаются после эффекта, например:

$('#someDiv').slideDown(100, function() { 
    $(this).remove(); 
});

Answer 2

Сделав поиск в Google по jQuery и setTimeout, я нашел пример, который отправил меня по другому пути. Я думаю, что проблема возникает из-за того, что div-манипуляция находится на отдельном селекторе от реальной анимации. Это приводит к тому, что div создается и удаляется даже во время анимации. Добавив простой оператор animate в div, который задерживает удаление до завершения основной анимации, я могу добиться желаемого эффекта.

Answer 3

Проблема в том, что DOM не обновляется, пока ваша функция не завершится. Таким образом, использование setTimeout приведет к обновлению dom, и через 100 мсек остальные функции будут продолжены. Если вы не хотите, чтобы новый div был виден, я бы установил абсолютную позицию, а верхнюю - что-то вроде -5000. Он будет иметь размеры и т.д., просто не будет виден. Вы также можете установить видимость (в css) скрытой, только если вы беспокоитесь, что она появится на экране.

Answer 4

Разве это не работает, если вы используете setTimeout? -)