Adding a page loader using jQuery

by

This has many solutions, but a simple one is to:

1- Create an overlay DIV with your loader stuff and prepend to BODY;
2- Add an event listener for window.load or document.ready event that hides this DIV.

// On the first line inside BODY tag
<script type="text/javascript">
    jQuery("body").prepend('<div id="preloader">Loading...</div>');
    jQuery(document).ready(function() {
        jQuery("#preloader").remove();
    });
</script>

(code typos fixed)

Leave a Comment