Loader by Shoh2008
#212121
1.loader { 2 width: 16px; 3 height: 16px; 4 position: relative; 5 left: -32px; 6 border-radius: 50%; 7 color: #fff; 8 background: currentColor; 9 box-shadow: 32px 0 , -32px 0 , 64px 0; 10} 11 12.loader::after { 13 content: ''; 14 position: absolute; 15 left: -32px; 16 top: 0; 17 width: 16px; 18 height: 16px; 19 border-radius: 10px; 20 background: #FF3D00; 21 animation: move_351 3s linear infinite alternate; 22} 23 24@keyframes move_351 { 25 0% , 5% { 26 left: -32px; 27 width: 16px; 28 } 29 30 15% , 20% { 31 left: -32px; 32 width: 48px; 33 } 34 35 30% , 35% { 36 left: 0px; 37 width: 16px; 38 } 39 40 45% , 50% { 41 left: 0px; 42 width: 48px; 43 } 44 45 60% , 65% { 46 left: 32px; 47 width: 16px; 48 } 49 50 75% , 80% { 51 left: 32px; 52 width: 48px; 53 } 54 55 95%, 100% { 56 left: 64px; 57 width: 16px; 58 } 59}
855 views
855 views
MIT License