.animate() и .remove() не играют хорошо вместе

Question

Я пытаюсь отклонить панель уведомлений, которую я ранее добавлял к телу.

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'}); 

Это, само собой, работает хорошо, но моя цель состоит в том, чтобы переместить объект DIV, так что я добавил .remove() заявление, чтобы удалить его после завершения анимации.

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'}); 
$('#notify-panel').remove(); 

Когда я запускаю это, панель удаляется из тела, но одушевленные не получает казнены, слой исчезает. Поэтому я добавил .remove() как часть обратного вызова.

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'}, {callback: function(){ $(this).remove(); }}); 

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

Answer 1

Это может быть решена путем reading the manual. Используйте один из них:

$('#notify-panel').animate({ 
    top: -250 
}, { 
    duration: 1000, 
    easing: 'easeInOutBack', 
    complete: function() { 
     $(this).remove(); 
    } 
}); 

Или:

$('#notify-panel').animate({ 
    top: -250 
}, { 
    duration: 1000, 
    easing: 'easeInOutBack' 
}, function() { 
    $(this).remove(); 
}); 

Answer 2

Во-первых, вам не хватает кавычек вокруг значения и px.

Я бы написал так:

$('#notify-panel').animate({ 
    top: '-250px' 
}, { 
    easing: 'easeInOutBack' 
}, 1000, function() { 
    $(this).remove(); 
});