Loader by Shoh2008
#212121
1.loader { 2 width: 100px; 3 height: 46px; 4 position: relative; 5 border-bottom: 5px solid #FFF; 6 border-top: 5px solid #FFF; 7 box-sizing: border-box; 8} 9 10.loader:before , .loader:after { 11 content: ""; 12 position: absolute; 13 left: 0; 14 top: -20px; 15 width: 32px; 16 height: 32px; 17 border-radius: 50%; 18 background: orange; 19 border: 5px solid #FFF; 20 box-sizing: border-box; 21 animation: slide_391 1s infinite ease-in-out alternate; 22} 23 24.loader:after { 25 top: 20px; 26 animation-direction: alternate-reverse; 27} 28 29@keyframes slide_391 { 30 0% , 20% { 31 transform: translateX(70px) 32 } 33 34 80% , 100% { 35 transform: translateX(-1px) 36 } 37} 38
646 views
646 views
MIT License