Preloader#2

HTML
<div id="preloader"> <div id="loader"></div> </div>
CSS
#preloader { position: absolute; background: #000; width: 100%; height: 100%; z-index: 100500; } #loader { position: absolute; border: 6px #fff solid; width: 150px; height: 150px; top: 50%; left: 50%; margin: -75px 0 0 -75px; animation: spin 4s infinite ease; } #loader:after, #loader:before { content: ""; position: absolute; top: 50%; left: 50%; } #loader:after { border: 6px #fff solid; width: 100px; height: 100px; margin: -56px 0 0 -56px; animation: spin 4s infinite ease; } #loader:before { border: 6px #fff solid; width: 50px; height: 50px; margin: -31px 0 0 -31px; animation: spin 4s infinite ease; } @keyframes spin { from { transform: rotate(0deg); } 50% { border-radius: 50%; } to { transform: rotate(360deg); } }
JAVASCRIPT
Expand for more options Login