#javascript #jquery #jquery-animate #fadein #replacewith
#javascript #jquery #jquery-анимировать #fadein #replacewith
Вопрос:
То, что я пытаюсь сделать, это просто удалить все изображения внутри контейнеров, заменить изображение #next1 на #active и после этого снова удалить все изображения.
вот мой код:
$('.logo').fadeOut('slow', function() {
$('#active>img').replaceWith( $('#next1>img') );
}).fadeIn('slow', function() {});
это не работает. я обнаружил, что смотрю на пустой #active
но это, однако;
$('.logo').fadeOut('slow', function() {}).fadeIn('slow', function() {});
$('#active>img').replaceWith( $('#next1>img') );
делает замену просто отличной, но не анимацию, которую я пытаюсь сделать.
я получаю одинаковые результаты как с Chrome, так и с ie.
Ответ №1:
Мое предложение здесь состояло бы в том, чтобы посмотреть на методы promise / done в jQuery. В качестве примера здесь вы могли бы сделать что-то вроде:
$('.logo').fadeOut('slow').promise().done(function(logo) {
$('#active>img').replaceWith($('#next1>img'));
$(logo).fadeIn('slow');
});
Обещание jQuery — http://api.jquery.com/promise /
Ответ №2:
Попробуйте:
$('.logo').fadeOut('slow', function() {
$('#active>img').replaceWith( $('#next1>img') );
$(this).fadeIn('slow');
});
Предполагая, что вы хотите добиться исчезновения, затем замените содержимое, пока .logo
оно скрыто, а затем исчезнет после замены логотипа.