How to use

fadeIn

function

in

JQuery

$('#categories').on('click', '.btn-categories', function(){

    if (this.id == 'all') {
      $('#parent > div').fadeIn(450);
    } else {
      var $el = $('.' + this.id).fadeIn(450);
      $('#parent > div').not($el).hide();
    }
     $("#categories .btn-categories").removeClass("active");
    $(this).addClass('active');

  });

//
// Dropdown animations
//

/* eslint-env browser, jquery */
$(() => {
 $(document)
  .on('show.bs.dropdown', '.dropdown', function() {
   $(this).find('.dropdown-menu').stop(true, true).fadeIn(100);
  })
  .on('hide.bs.dropdown', '.dropdown', function() {
   $(this).find('.dropdown-menu').stop(true, true).fadeOut(100);
  });
});

//showLoading
  showLoading() {
    $('#loading').stop().fadeIn(200);
  }

// 上に戻るボタン
function backToTop() {
 const mainHasTabFixed = $('main').hasClass('tab-fixed');
 const scrollTargetClass = (!mainHasTabFixed) ? 'main' : '.contents';
 $(scrollTargetClass).scroll(function () {
  const btn = $('.fixed-action-btn:eq(1)');
  const scroll = $(this).scrollTop();
  (scroll > 180) ? btn.fadeIn() : btn.fadeOut();
 });
}

$(modal).add(overlay).stop(true, true).fadeIn(100);

var html = $('<div class="alert ' + color_markup + '">' + icon_markup + text + '</div>').fadeIn(options['fade-duration']);

// 上に戻るボタン
function backToTop() {
 const mainHasTabFixed = $('main').hasClass('tab-fixed');
 const scrollTargetClass = (!mainHasTabFixed) ? 'main' : '.contents';
 $(scrollTargetClass).scroll(function () {
  const btn = $('.fixed-action-btn:eq(1)');
  const scroll = $(this).scrollTop();
  (scroll > 180) ? btn.fadeIn() : btn.fadeOut();
 });
}