How To Detect If A Page Has Fully Rendered Using Jquery?

When using $(document).ready(functioon(){alert('Loaded.')}); it pops up the alert box that says 'Loaded.' even before the page has fully loaded (in other words there're loading sti

Solution 1:

$(window).on('load', function() {
    //everything is loaded
});

Solution 2:

Try out .load() instead.

$(document).load(function () {
    alert('Loaded');
}

The load event is sent to an element when it and all sub-elements have been completely loaded. http://api.jquery.com/load-event/

Solution 3:

Using javascript

window.onload = function () { alert("loaded"); }

Solution 4:

You can read more about it here. https://github.com/codef0rmer/learn.jquery.com/blob/master/content/jquery-basics/document-ready.md