index.wxss 787 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. /* components/loading/index.wxss */
  2. .loading {
  3. width: 228rpx;
  4. height: 220rpx;
  5. position: fixed;
  6. left: calc(100vw / 2 - 228rpx / 2);
  7. top: calc(100vh / 2 - 220rpx / 2);
  8. z-index: 20000;
  9. }
  10. .loading-image {
  11. width: 100%;
  12. height: 100%;
  13. }
  14. .aniamtion {
  15. animation: mymove 2s infinite;
  16. animation-direction: alternate;
  17. animation-timing-function: ease-in;
  18. /* //infinite属性是表示无限循环的意思,没有这个属性的话动画只执行一次。 */
  19. }
  20. @keyframes mymove {
  21. 0% {
  22. transform: scale(1);
  23. }
  24. 25% {
  25. transform: scale(0.7);
  26. }
  27. 50% {
  28. transform: scale(0.5);
  29. }
  30. 75% {
  31. transform: scale(0.7);
  32. }
  33. 100% {
  34. transform: scale(1);
  35. }
  36. }