Home/ Questions/Q 6659043
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T01:59:06+00:00

What is the easiest way to implement a page load / loading.gif using jquery,

  • 0

What is the easiest way to implement a page load / loading.gif using jquery, just like any other sites.. It needs white out the page and show loading.gif in the middle of it, until the page loads..
I do not want to write it halfway down the page so it doesn’t even have a purpose, i would like for this to load first thing on the page.. Is there a way i can do this without writing static divs on that page? Preferrably a .js file that does it all without any writing div’s/etc to the page?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If you mean that when your visitor first loads a page, you get the nothing but a spinny icon until the page is ready ?

    What I’d do as put a DIV at the top of the page with your loading GIF, and another place another div around the page content with display:none on it that contains the main body of the page.

    <body>
  <div class='loadDiv'>
    <img src='spinner.gif' class='spinner_gif' />
  </div>
  <div class='mainContent' style='display:none;'>
    <p> stuff!</p>
  </div>
</body>

    Then in your DOM load event:

    $(document).ready(function() {
    $('.loadDiv').hide();
    $('.mainContent').show();
});

    This would force your loading div to show until the DOM acknowledges that the page is ready.

    • 0