main

animate-css/animate.css

Last updated at: 29/12/2023 09:20

zoomOutUp.css

TLDR

This file defines the CSS animation zoomOutUp that scales an element down and fades it out while moving it upwards.

Methods (if applicable)

N/A

Classes (if applicable)

zoomOutUp

This class applies the zoomOutUp animation to an element, causing it to scale down, fade out, and move upwards.

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutUp {
  animation-name: zoomOutUp;
  transform-origin: center bottom;
}