コードは単純ですが、ページはローダーとともにロードされます。ページ全体がロードされる前のローダーを表示
<script>
$(window).load(function() {
$(".loader").delay(2000).fadeOut("slow");
})
</script>
<body>
<header>
<div class="loader"><img src="img/loader.gif"></div>
</header>
</body>
<body>
<header>
<div class="loader"><img src="img/loader.gif"></div>
<script>
$(".loader").fadeOut("slow");
</script>
</header>
</body>
、それがレンダリングされます直後にローダーを示し行い、その後、徐々にフェードアウトべき。この<header>セクションを入力し、スクリプトを<body>の最初の項目にする必要があります。
好ましくは、document.readyを以下のように使用します。
$(document).ready(function() {
$(".loader").delay(2000).fadeOut("slow");
})<script src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
<header><div class="loader"><img src="img/loader.gif" alt="loading............."/></div> </header>
[ページ全体がロードされる前に、ロードバーを表示する]の可能複製（https://stackoverflow.com/questions/11072759/display-a-loading-bar-before-ページ全体が読み込まれます） –
より適切に関連している可能性があります：https://stackoverflow.com/questions/23906956/show-loading-icon-until-the-page-is-load –
このロードGIF？ 2秒間表示してからフェードアウトするか、残りのDOMが実際にロードされている間に表示しますか？ – Koen