How to find out $ (window) .load (); status from jquery

Question

I created a progress bar for loading a website using the jQuery UI progress bar. This progress bar shows the status of loading scripts. Sample

$.getScript('_int/ajax.js',function() { $("#progressinfo").html("Loading Complete ..."); $("#progressbar").progressbar({ value: 100 }); }); 

This progress bar is located in #indexloader , which blocks the downloadable site, its CSS:

 #indexloader { z-index:100; position:fixed; top:0; left:0; background:#FFF; width:100%;height:100%; } 

After the progress bar reaches 100% , I want to hide and remove #indexloader for what I used

 $("#indexloader").fadeOut("slow",function() { $("#indexloader").remove(); }); 

But the problem is that although the scripts are loaded, the pages are not fully loaded, I see that images and other things are still loading.

So, before #indexloader out and removing #indexloader , I want to check if $(window).load() or not

Is there any way to check this?

Answer 1

Add a window property:

 $(window).load(function() { window.loaded = true; }); 

Then check window.loaded before hiding #indexloader .

Answer 2

Does the bootloader window.load on the window.load parameter? This seems to be the easiest way to do what you want:

 $(window).load(function() { $("#indexloader").fadeOut("slow",function() { $("#indexloader").remove(); }); }); 

Alternatively, set the variable to window.load , for example:

 var loaded = false; $(window).load(function() { loaded = true; }); 

Then modify your fadeout code to find it:

 function fadeIndex() { $("#indexloader").fadeOut("slow",function() { $("#indexloader").remove(); }); } if (loaded) fadeIndex(); //aleady loaded else $(window).load(fadeIndex); //fade when we do load