animate.css 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. .animate {
  2. -webkit-animation-duration: 0.2s;
  3. animation-duration: 0.2s;
  4. -webkit-animation-fill-mode: both;
  5. animation-fill-mode: both;
  6. }
  7. @-webkit-keyframes slideInLeft {
  8. from {
  9. -webkit-transform: translate3d(-100%, 0, 0);
  10. transform: translate3d(-100%, 0, 0);
  11. visibility: visible;
  12. }
  13. to {
  14. -webkit-transform: translate3d(0, 0, 0);
  15. transform: translate3d(0, 0, 0);
  16. }
  17. }
  18. @keyframes slideInLeft {
  19. from {
  20. -webkit-transform: translate3d(-100%, 0, 0);
  21. transform: translate3d(-100%, 0, 0);
  22. visibility: visible;
  23. }
  24. to {
  25. -webkit-transform: translate3d(0, 0, 0);
  26. transform: translate3d(0, 0, 0);
  27. }
  28. }
  29. .slideInLeft {
  30. -webkit-animation-name: slideInLeft;
  31. animation-name: slideInLeft;
  32. }
  33. @-webkit-keyframes slideInRight {
  34. from {
  35. -webkit-transform: translate3d(100%, 0, 0);
  36. transform: translate3d(100%, 0, 0);
  37. visibility: visible;
  38. }
  39. to {
  40. -webkit-transform: translate3d(0, 0, 0);
  41. transform: translate3d(0, 0, 0);
  42. }
  43. }
  44. @keyframes slideInRight {
  45. from {
  46. -webkit-transform: translate3d(100%, 0, 0);
  47. transform: translate3d(100%, 0, 0);
  48. visibility: visible;
  49. }
  50. to {
  51. -webkit-transform: translate3d(0, 0, 0);
  52. transform: translate3d(0, 0, 0);
  53. }
  54. }
  55. .slideInRight {
  56. -webkit-animation-name: slideInRight;
  57. animation-name: slideInRight;
  58. }