HTML

<div id="load">
     <span class="loader"></span>
</div>

CSS

#load {position: fixed;left:0;top:0;width: 100%;height: 100%;background: rgba(0,0,0,0.4);z-index: 9999;display: flex;align-items:center;justify-content:center}
.loader {
     width: 48px;
     height: 48px;
     border: 5px dotted #fff;
     border-radius: 50%;
     display: inline-block;
     position: relative;
     box-sizing: border-box;
     animation: rotation 2s linear infinite;
}

@keyframes rotation {
     0% {
          transform: rotate(0deg);
     }
     100% {
          transform: rotate(360deg);
     }
} 

JS

$(document).ready(function () {
     $("#load").fadeOut(500);
});

결과

See the Pen loader by Juyeon (@Juyeon) on CodePen.