title: Calculate & Display percentage of progress of page load
body: <p>I have a loader which loads when page loads at the starting. I need to show the percentage of completion in it.</p>
  
  <p>My application has lots of jquery and css included in it and it also include a ajax call.</p>
  
  <p>As of now, I have displayed the progress bar when page load starts and hided it when the ajax completed successfully.</p>
  
  <p>Also, I have displayed the percentage but increased it manually using the below code:</p>
  
  <pre><code>function timeout_trigger() {
      $(".progress").css("max-width", p + "%");
      $(".progress-view").text(p + "%");
      if (p != 100) {
          setTimeout('timeout_trigger()', 50);
      }
      p++;
  }
  timeout_trigger();
  </code></pre>
  
  <p>The problem here is, before the progress reaches 100, the page loads and the content is displayed and hence the loader is hided in between let say - at 60% - the loader is hided.</p>
  
  <p>I want to calculate the percentage of page load completion (ie. jquery loading time, css loading time etc) dynamically and increase the progress accordingly.</p>
  
  <p>Please help to get through this..</p>