_animation.scss 810 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. /**
  2. * [css3过渡动画]
  3. * @param {[string]} $el [eg:'.pressRotate']
  4. */
  5. @mixin myMove ($el) {
  6. #{$el} {
  7. -webkit-animation: mymove .5s ease-in;
  8. -moz-animation: mymove .5s ease-in;
  9. -o-animation: mymove .5s ease-in;
  10. animation: mymove .5s ease-in;
  11. }
  12. @keyframes mymove {
  13. 0% {
  14. transform: rotateX(0deg);
  15. }
  16. 100% {
  17. transform: rotateX(360deg);
  18. }
  19. }
  20. @-moz-keyframes mymove {
  21. 0% {
  22. transform: rotateX(0deg);
  23. }
  24. 100% {
  25. transform: rotateX(360deg);
  26. }
  27. }
  28. @-webkit-keyframes mymove {
  29. 0% {
  30. transform: rotateX(0deg);
  31. }
  32. 100% {
  33. transform: rotateX(360deg);
  34. }
  35. }
  36. @-o-keyframes mymove {
  37. 0% {
  38. transform: rotateX(0deg);
  39. }
  40. 100% {
  41. transform: rotateX(360deg);
  42. }
  43. }
  44. }