title: Multiple Iframes loaded asynchronously
body: <p>I'm working on a new prototype for an application and I'm conducing some tests before starting.
  I'm trying to create many iframes in my page. I wrote this code in order to verify the asynchronously loading, but the behavior I'm experiencing is not what I expected.</p>
  
  <p>Here the code I'm using:</p>
  
  <pre><code>&lt;html&gt;
     &lt;head&gt;
     &lt;title&gt;test&lt;/title&gt;
     &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"&gt;&lt;/script&gt;
     &lt;script type="text/javascript"&gt;
        function appendNew(container, location) {
           var chart = $("&lt;iframe&gt;")
              .attr('src', location)
              .css('width', 150)
              .css('height', 150);
  
           container.append(chart);
         }
  
      $(function () {                               
          var urls = ["http://local.test.com?test=1",
                      ...
                      "http://local.test.com?test=20"];
  
          var container = $("#testDiv");
  
          $.each(urls, function (idx, item) {
              appendNew(container, item);
          })
      })
      &lt;/script&gt;
  
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="testDiv"&gt;&lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>It's just a loop on a url array, some jQuery code will take care to append a new Iframe to the page for each one of them.
  All the urls point to the same page, it's just a simple asp.net page hosted by my local IIS 7.5 with the following code into the Page_Load:</p>
  
  <pre><code>Thread.Sleep(2000);
  </code></pre>
  
  <p>What I expect is that all the iframes are loaded at the same time.
  The result I get is that they're loaded in sets of 6 (i.e. when 20: 6/6/6/2).
  Any reason/solution?</p>
  
  <p>This behavior is the same on Chrome, Firefox and IE.</p>