main

animate-css/animate.css

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

lightSpeedInLeft.css

TLDR

The provided CSS file defines an animation called lightSpeedInLeft that moves an element in from the left side of the screen with a skewed effect. It also includes a CSS class .lightSpeedInLeft that applies this animation to an element.

Classes

lightSpeedInLeft

This class applies the lightSpeedInLeft animation to an element. The animation moves the element in from the left side of the screen with a skewed effect.

@keyframes lightSpeedInLeft {
  from {
    transform: translate3d(-100%, 0, 0) skewX(30deg);
    opacity: 0;
  }

  60% {
    transform: skewX(-20deg);
    opacity: 1;
  }

  80% {
    transform: skewX(5deg);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.lightSpeedInLeft {
  animation-name: lightSpeedInLeft;
  animation-timing-function: ease-out;
}