flipInY.css 561 B

12345678910111213141516171819202122232425262728293031
  1. @keyframes flipInY {
  2. 0% {
  3. transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
  4. transition-timing-function: ease-in;
  5. opacity: 0;
  6. }
  7. 40% {
  8. transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
  9. transition-timing-function: ease-in;
  10. }
  11. 60% {
  12. transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
  13. opacity: 1;
  14. }
  15. 80% {
  16. transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  17. }
  18. 100% {
  19. transform: perspective(400px);
  20. }
  21. }
  22. .flipInY {
  23. backface-visibility: visible !important;
  24. animation-name: flipInY;
  25. }