title: browser stuck on ajax request
body: <p>i developed a simple web site which uses ajax to load content and while the content is loading, i'm displaying a progress. Everything works as expected on 1st ajax call but after that, it becomes a mess</p>
  
  <ol>
  <li>page gets stuck on ajax call</li>
  <li>i've written a function to listen to ajax call and show loading message, it doesn't work too and the page becomes very laggy and slow after the 1st ajax call.</li>
  </ol>
  
  <p>Here is my ajax function.</p>
  
  <pre><code>function loadPage(path) {
  $.ajax({
      type: "POST",
      context: document.body,
      dataType: "html",
      timeout: 10000,
      url: path
  });}
  </code></pre>
  
  <p>i tried to async to true but its true by default. still it didn't help. a demo of the problem can be seen at : REMOVED SINCE PROBLEM SOLVED</p>
  
  <p>This works perfectly fine on the localhost but as soon as i uploaded it to my remote server,problems started to occur. can an expert please be kind point out what have i done wrong ? i tried removing all little the animations from this, non helped.</p>
  
  <hr>
  
  <p>the problem was me loading javascript files on each ajax cal causing too many get and post requests and unnecessary dom changes.</p>