Advertisement
n3ito

[code] rubber band text

May 21st, 2022
43
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 0.94 KB | None
  1. <style>
  2. #band {
  3. text-align:center;
  4. font-family: Times New Roman;
  5. font-weight: 900;
  6. color: #000;
  7. font-size: 30px;
  8. line-height: 60px;
  9. animation: rubberBand 0.9s;
  10. animation-iteration-count: infinite;
  11.  
  12. }
  13.  
  14. band {
  15. transform: scale3d(1, 1, 1);
  16. }
  17.  
  18. @-webkit-keyframes rubberBand {
  19. 0% {
  20. -webkit-transform: scale3d(1, 1, 1);
  21. transform: scale3d(1, 1, 1);
  22. }
  23.  
  24. 30% {
  25. -webkit-transform: scale3d(1.25, 0.75, 1);
  26. transform: scale3d(1.25, 0.75, 1);
  27. }
  28.  
  29. 40% {
  30. -webkit-transform: scale3d(0.75, 1.25, 1);
  31. transform: scale3d(0.75, 1.25, 1);
  32. }
  33.  
  34. 50% {
  35. -webkit-transform: scale3d(1.15, 0.85, 1);
  36. transform: scale3d(1.15, 0.85, 1);
  37. }
  38.  
  39. 65% {
  40. -webkit-transform: scale3d(.95, 1.05, 1);
  41. transform: scale3d(.95, 1.05, 1);
  42. }
  43.  
  44. 75% {
  45. -webkit-transform: scale3d(1.05, .95, 1);
  46. transform: scale3d(1.05, .95, 1);
  47. }
  48.  
  49. 100% {
  50. -webkit-transform: scale3d(1, 1, 1);
  51. transform: scale3d(1, 1, 1);
  52. }
  53. }
  54.  
  55. </style>
  56. <div id="band">Rubber Band</div>
Advertisement
RAW Paste Data Copied
Advertisement