javascript - Showing iFrame only after its source content has been completely loaded -

i have iframe on page thats display style none. have javascript function set source , set display block. problem iframe shows before content of loaded , flickering effect. goes white first , displays content. need set source, , when done loading content of source, set display style.

css & javascript

.showme{display:block;}  function(url) { document.getelementbyid('myiframe').src = url; document.getelementbyid('myiframe').classname = showme; } 

i suggest try following:

<script type="javascript">     var iframe = document.createelement("myiframe");     iframe.src = url;          if (navigator.useragent.indexof("msie") > -1 && !window.opera){                 iframe.onreadystatechange = function(){             if (iframe.readystate == "complete"){                             //not sure if code works below reference                   document.getelementbyid('myiframe').class = showme;                   //or work                   //document.getelementbyid("myiframe").classname = "showme";                  }             };         }                else          {             iframe.onload = function(){                   //not sure if code works below reference                   document.getelementbyid('myiframe').class = showme;                   //or work                   //document.getelementbyid("myiframe").classname = "showme";             };         }  </script> 

based on code found here.