Simple loader page jquery
.loader{
background: #AB201C; /*Fondo*/
position: absolute;
width: 100%;
height: 100%;
color: #fff;
z-index: 9000;
}
.spinner {
width: 40px;
height: 40px;
position: relative;
margin: auto auto;
}
.wrapperloader{
width: 60px;
height: 60px;
position: absolute;
top: 0;
left: 0;
bottom: 60px;
right: 0;
margin: auto auto;
}
.double-bounce1, .double-bounce2 {
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #fff; /*color del loader*/
opacity: 0.6;
position: absolute;
top: 0;
left: 0;
-webkit-animation: bounce 2.0s infinite ease-in-out;
-moz-animation: bounce 2.0s infinite ease-in-out;
animation: bounce 2.0s infinite ease-in-out;
}
$(window).load(function() {
$('.loader').delay(100).fadeOut(800, function() {
});
});
<div class="loader">
<div class="wrapperloader">
<div class="spinner">
<div class="double-bounce1"></div>
<div class="double-bounce2"></div>
</div>
</div>
</div>