Databases
StackOverflow2013
Postsdbo
PODOM Events - Progress Indicator for Iframe location change
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PODOM Events - Progress Indicator for Iframe location change
    text
    copied!<p>I am looking for a solution to show a progress indicator when an iframe page changes, <em>but prior to the iframe loading completely</em>.</p> <p>There are 100's of pages on stackoverflow going over the differences between <em>jquery ready(), javascript window.load, document.load, DOMContentReady, on('pageinit'...)</em> and after reading the differences on all these various techniques I'm now a bit stuck on how to accomplish trapping the event within the iframe. </p> <p>So far I have only succeeded in capturing when the iframe has changed once the DOM is built. I would like to be able to detect when a page is about to load so I could have some sort of indicator/spinner in my header.</p> <p>This is what I have so far (capturing the iframe change on the onload):</p> <pre><code>..... &lt;iframe id="rssID" src="http://feeds.reuters.com/reuters/oddlyEnoughNews" onload="blerg()" style="width: 800px; height:600px"/&gt; ...... $(document).on('pageinit','#index', function(){ alert('pageinit'); //gets called on first load }); $(document).on('pageinit','#rssID', function(){ alert('pageinit rssFeed'); //nothing happens. }); function blerg() { var myIframe = document.getElementById("rssID"); myIframe.onload = func; }; function func() { alert("changed"); } </code></pre> <ul> <li><a href="http://jsfiddle.net/Gdxvs/" rel="nofollow">http://jsfiddle.net/Gdxvs/</a></li> </ul> <p>It would appear that pageinit is the correct path but I have no idea on how to trap that within an iframe. I would prefer <em>not using jquery</em>, but I'm not sure that is possible without huge amounts of code.</p> <p>One final: Do I need to use a <code>die("pageinit");</code> </p> <p>Thanks a million!</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload