Getting the load time of each iframe with multiple sources
<p>I am trying to get the loadtime of each iframe, and then display the time. Here is the code i currently have (without the loading time calculations):</p>

<pre><code>&lt;iframe id="1"  width="100" height="100" src=""&gt;&lt;/iframe&gt;

&lt;script type="text/javascript"&gt;
$(document).ready(function(){   
    var array = ['http://www.example1.com', 'http://www.example2.com', 'http://www.example3.com'];
    $('#1').on('load', function() {                 
       $('#1').attr('src', array.pop());             
    }).attr('src', array.pop());
});
&lt;/script&gt;
</code></pre>

<p>It puts links from an array into an iframe, loading each iframe one after another. </p>

<p>This is how i used to do get loading time before:</p>

<pre><code>&lt;script type="text/javascript"&gt;
beforeload = (new Date()).getTime();
function pageloadingtime(i)
{

    var afterload = (new Date()).getTime();
    var seconds = (afterload-beforeload)/1000;
    document.getElementById("loadingtime"+i).innerHTML = seconds;
}
&lt;/script&gt;
</code></pre>

<p>This method didnt work for me because it loaded all the iframes at the same time, instead of loading one by one. </p>

<p>How do i use the 2nd codes methods of counting and displaying the loadtimes of iframes, in the 1st code?</p>
