headShake.css 443 B

12345678910111213141516171819202122232425262728293031
  1. @keyframes headShake {
  2. 0% {
  3. transform: translateX(0);
  4. }
  5. 6.5% {
  6. transform: translateX(-6px) rotateY(-9deg);
  7. }
  8. 18.5% {
  9. transform: translateX(5px) rotateY(7deg);
  10. }
  11. 31.5% {
  12. transform: translateX(-3px) rotateY(-5deg);
  13. }
  14. 43.5% {
  15. transform: translateX(2px) rotateY(3deg);
  16. }
  17. 50% {
  18. transform: translateX(0);
  19. }
  20. }
  21. .headShake {
  22. animation-timing-function: ease-in-out;
  23. animation-name: headShake;
  24. }