Description

Adds new Craft.animate() and Craft.animateAll() methods, which apply new CSS properties to the given element(s) with an animation.

A ViewTransition is used for browsers that support it, or Velocity.js is used as a fallback (😒 Firefox).

// animate a single element
await Craft.animate(myElement, {opacity: 0});

// animate multiple elements together
const animations = [
  [myElement1, {opacity: 0}],
  [myElement2, {'margin-top': '-50px'}],
];
await Craft.animateAll(animations);