Effects & Animation

// Basic show/hide with animation
$("#box").hide(300);
$("#box").show("slow");
$("#box").toggle(200);

// Fading
$("#box").fadeIn(500).fadeOut(500);
$("#box").fadeTo(300, 0.5);

// Sliding
$("#panel").slideDown(200);
$("#panel").slideUp("fast");
$("#panel").slideToggle();

// Custom animation
$("#box").animate(
  { width: "+=50", opacity: 0.5 },
  400,
  "swing",
  () => console.log("done")
);

// Stop queued animations
$("#box").stop(true, true);