jQuery add/remove Class with fadeIn/Out

Another way to achieve that, using your original jQuery code, the CSS way :

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

Smoother animation, easier to maintain.

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

Perhaps used setTimeout function after fadeIn class

 $('#loader').addClass('loader').fadeIn('slow');
 setTimeout(function(){  $('#loader').removeClass('loader'); }, 1000);

Fade In:

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

Fade Out:

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

As another user said, you may want to look into using toggleClass.

Related