html Easy Preloader

Posted 2021-05-11

.preloader {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #131F23;
    z-index: 100500;
    .spinner {
        width: 32px;
        height: 32px;
        position: absolute;
        left: 50%;
        top: 50%;
        background: url('../img/icons/ajax-loader.gif') no-repeat 50% 50%;
        margin: -16px 0 0 -16px;
    }
}

$(window).on('load', function () {
    var $preloader = $('#preloader'),
        $spinner = $preloader.find('.spinner');
	  $spinner.delay(150).fadeOut();
	  $preloader.delay(350).fadeOut(300);
});

<div id="preloader" class="preloader"><span class="spinner"></span></div>