jQueryは、fadeIn / Outを使用してクラスを追加/削除します

Question

AddClass関数にfadeInエフェクトを適用し、removeClassにfadeOutを適用します...

手伝って頂けますか？

これは私のコードです

$('#loader'+idTurno).addClass('loader');

...

$('#loader'+idTurno).removeClass('loader');

Answer 1

フェードイン：

$("#loader").fadeIn("slow", function() {
    $(this).addClass("loader");
});

フェードアウト：

$("#loader").fadeOut("slow", function() {
    $(this).removeClass("loader");
});

別のユーザーが言ったように、 toggleClass の使用を検討することもできます。

Answer 2

元のjQueryコードを使用してCSSを使用する別の方法：

#loader {
  transition: opacity 500 ease-in-out;
}

スムーズなアニメーション、維持しやすい。

Answer 3

#loader {
  transition: all 0.9s ease-out 0s;
}

Answer 4

それを簡単に ：

$('#loader'+idTurno).addClass('loader').fadeIn(1000);
$('#loader'+idTurno).removeClass('loader').fadeIn(1000);