Блог

Главная - Вопросы по программированию - jQuery fadeOut и fadeIn не работают должным образом

jQuery fadeOut и fadeIn не работают должным образом

#jquery

#jquery

Вопрос:

У меня есть следующий код:

 $('#oldLoginProblem').fadeOut();
$('#newLoginProblem').fadeOut();
$('#newLoginProblem').fadeIn();

Он запускается каждый раз, когда я нажимаю кнопку.

Вначале это будет выглядеть так:

foobar

Но когда я нажимаю свою кнопку и запускаю этот код, это выглядит следующим образом:

foobar

foobar2

Первый элемент не исчезает, он остается. Второй элемент просто отображается ниже, как будто у меня есть simple .show() . Кроме того, никакого замирания не происходит каким-либо образом. Как я могу это решить?

Комментарии:

1. Вам следует опубликовать свой HTML-код и jQuery целиком, чтобы мы могли видеть, что происходит.

2. jsfiddle.net/p3469 попробуйте это

3. @rsplak — Не используйте задержки! Они ненадежны. Вместо этого вы должны использовать обратные вызовы для правильной анимации цепочки. jsfiddle.net/p3469/1

Ответ №1:

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

 $('#oldLoginProblem').fadeOut('slow', function(){
    $('#newLoginProblem').fadeOut('slow', function(){
        $('#newLoginProblem').fadeIn('slow');
    });
});

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