fakeloader.css 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889
  1. #fakeloader-overlay {
  2. opacity: 0;
  3. top: 0px;
  4. left: 0px;
  5. position: fixed;
  6. background-color: rgba(0, 0, 0, 0.8);
  7. height: 100%;
  8. width: 100%;
  9. z-index: 9998;
  10. -webkit-transition: opacity 0.2s linear;
  11. -moz-transition: opacity 0.2s linear;
  12. transition: opacity 0.2s linear;
  13. }
  14. #fakeloader-overlay.visible {
  15. opacity: 1;
  16. }
  17. #fakeloader-overlay.hidden {
  18. opacity: 0;
  19. height: 0px;
  20. width: 0px;
  21. z-index: -10000;
  22. }
  23. #fakeloader-overlay .loader-wrapper-outer {
  24. background-color: transparent;
  25. z-index: 9999;
  26. margin: auto;
  27. width: 100%;
  28. height: 100%;
  29. overflow: hidden;
  30. display: table;
  31. text-align: center;
  32. vertical-align: middle;
  33. }
  34. #fakeloader-overlay .loader-wrapper-inner {
  35. display: table-cell;
  36. vertical-align: middle;
  37. }
  38. #fakeloader-overlay .loader {
  39. margin: auto;
  40. font-size: 10px;
  41. position: relative;
  42. text-indent: -9999em;
  43. border-top: 8px solid rgba(255, 255, 255, 0.5);
  44. border-right: 8px solid rgba(255, 255, 255, 0.5);
  45. border-bottom: 8px solid rgba(255, 255, 255, 0.5);
  46. border-left: 8px solid #AAA;
  47. -webkit-transform: translateZ(0);
  48. -ms-transform: translateZ(0);
  49. transform: translateZ(0);
  50. -webkit-animation: fakeloader 1.1s infinite linear;
  51. animation: fakeloader 1.1s infinite linear;
  52. }
  53. #fakeloader-overlay .loader, #fakeloader-overlay .loader:after {
  54. border-radius: 50%;
  55. width: 50px;
  56. height: 50px;
  57. }
  58. @-webkit-keyframes fakeloader {
  59. 0% {
  60. -webkit-transform: rotate(0deg);
  61. transform: rotate(0deg);
  62. }
  63. 100% {
  64. -webkit-transform: rotate(360deg);
  65. transform: rotate(360deg);
  66. }
  67. }
  68. @keyframes fakeloader {
  69. 0% {
  70. -webkit-transform: rotate(0deg);
  71. transform: rotate(0deg);
  72. }
  73. 100% {
  74. -webkit-transform: rotate(360deg);
  75. transform: rotate(360deg);
  76. }
  77. }