backOutLeft.css
TLDR
This CSS file defines animation keyframes and a CSS class for the "backOutLeft" animation.
Classes
backOutLeft
The "backOutLeft" class applies the "backOutLeft" animation to an element.
Animation Keyframes
backOutLeft
The "backOutLeft" animation keyframes define the following transformations and changes in opacity:
- 0%: The element is at its original scale of 1 and opacity of 1.
- 20%: The element is scaled down to 0.7 of its original size and its opacity is reduced to 0.7.
- 100%: The element is translated to the left by 2000px, scaled down to 0.7 of its original size, and its opacity remains at 0.7.
@keyframes backOutLeft {
0% {
transform: scale(1);
opacity: 1;
}
20% {
transform: translateX(0px) scale(0.7);
opacity: 0.7;
}
100% {
transform: translateX(-2000px) scale(0.7);
opacity: 0.7;
}
}
.backOutLeft {
animation-name: backOutLeft;
}