title: Iframe.readyState does not work in chrome
body: <p>I create an Iframe on the fly and set as the url a page that downloads a <strong>binary file (xls, doc...).</strong> While files are downloading I show an animation. When does not, I hide it.</p>
  
  <p>The problem is that Chrome does not know when the files are fully downloaded, that is when the iframe is completely loaded. I use the iframe property <code>readyState</code> to check the iframe state:</p>
  
  <pre><code>var iframe = document.createElement("iframe");
  iframe.style.visibility = "hidden";
  // I start a progress animation
  window.setTimeout(showProgressAnimation, 1000);
  // I start the file download
  iframe.src ='GetFile.aspx?file=' + fileName;
  document.body.appendChild(iframe);
  
  
  function showProgressAnimation() {
     if (iframe.readyState == "complete" || iframe.readyState == "interactive") {
        // I stop the animation and show the page
        animation.style.display = 'none';
        progressBar.hide();
        $('#page').show();
     }
     else {
        // Chrome is always getting into this line
        window.setTimeout(showProgressAnimation, 1000);
     }
  }
  </code></pre>
  
  <p>So the result is an infinite loop.</p>
  
  <p>I've tried the following and it works in Firefox and Chrome <strong>but not</strong> when the contents are a binary file:</p>
  
  <pre><code>if ($.browser.mozilla || $.browser.webkit ) {
      iframe.onload = function showProgressAnimation() {
          animation.style.display = 'none';
          progressBar.hide();
          $('#page').show();
      }
  }
  // IE
  else{
       window.setTimeout(showProgressAnimation, 1000);
  }
  </code></pre>