ball-pulse-round.css 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. @-webkit-keyframes ball-pulse-round {
  2. 0%, 80%, 100% {
  3. transform : scale(0);
  4. -webkit-transform : scale(0);
  5. }
  6. 40% {
  7. transform : scale(1);
  8. -webkit-transform : scale(1);
  9. }
  10. }
  11. @-moz-keyframes ball-pulse-round {
  12. 0%, 80%, 100% {
  13. -moz-transform : scale(0);
  14. transform : scale(0);
  15. -webkit-transform : scale(0);
  16. }
  17. 40% {
  18. -moz-transform : scale(1);
  19. transform : scale(1);
  20. -webkit-transform : scale(1);
  21. }
  22. }
  23. @-o-keyframes ball-pulse-round {
  24. 0%, 80%, 100% {
  25. -o-transform : scale(0);
  26. transform : scale(0);
  27. -webkit-transform : scale(0);
  28. }
  29. 40% {
  30. -o-transform : scale(1);
  31. transform : scale(1);
  32. -webkit-transform : scale(1);
  33. }
  34. }
  35. @keyframes ball-pulse-round {
  36. 0%, 80%, 100% {
  37. -moz-transform : scale(0);
  38. -o-transform : scale(0);
  39. transform : scale(0);
  40. -webkit-transform : scale(0);
  41. }
  42. 40% {
  43. -moz-transform : scale(1);
  44. -o-transform : scale(1);
  45. transform : scale(1);
  46. -webkit-transform : scale(1);
  47. }
  48. }
  49. .ball-pulse-round > div {
  50. -webkit-animation-fill-mode : both;
  51. -moz-animation-fill-mode : both;
  52. -o-animation-fill-mode : both;
  53. animation-fill-mode : both;
  54. width : 10px;
  55. height : 10px;
  56. -webkit-animation : ball-pulse-round 1.2s infinite ease-in-out;
  57. -moz-animation : ball-pulse-round 1.2s infinite ease-in-out;
  58. -o-animation : ball-pulse-round 1.2s infinite ease-in-out;
  59. animation : ball-pulse-round 1.2s infinite ease-in-out;
  60. }