Loading Page With jQuery

Used before category names. Blog JavaScript

If you want hide content until complete loading, you need a loading page. To create loading page follow the steps.

Add below code after the <body> tag.

<div class="loading-page">
    <img src="../animation.gif" alt="Loading..." />
</div>

Add styles to your CSS file.

.loading-page{
    position: fixed;
    z-index: 999999;
    background: #FFF;
    width: 100%;
    height: 100%;.
    display: flex;
    align-items: center;
}

.loading-page img{
    margin: 0 auto;
}

And finally add the jQuery code in your js file.

jQuery(window).load(function () {
  jQuery(".loading-page").hide();
});
Tags: