CSS загрузка анимации продолжает отображаться

Question

Я только что создал CSS загрузочную анимацию для моего нового веб-сайта и дал ему задержку 400 мс, но он продолжает отображаться? Как я могу отключить его, когда сайт полностью загружен?

/* ---------------------------------------------
     page  Prealoader JS
 --------------------------------------------- */


$(document).ready(function($) {
  'use strict';

  $(window).on('load', function() {
    $("#loading-center-page").fadeOut();
    $("#loading-page").delay(400).fadeOut("slow");
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Page Preloader HTML -->

<div id="loading-page">
  <div id="loading-center-page">
    <div id="loading-center-absolute">

      <div class="loader">O</div>
    </div>
  </div>

</div>

Answer 1

Событие вашего окна load не сработает, когда оно находится внутри документа ready, также вам не нужно помещать событие окна load внутри документа * Блок 1004 * просто вставляется независимо от ready блок, как это

  $(window).on('load', function() {
    $("#loading-center-page").fadeOut();
    $("#loading-page").delay(400).fadeOut("slow");
  });