Iframe onreadystatechange

I have an HTML page containing an <iframe> . <iframe> updated on certain events (and I see that the contents of the <iframe> changing, so all this is good).

What I want to do is add onreadystatechange to the <iframe> so that I can display the "loadable" text while the content is loading.

I could not add onreadystatechange to any browser (Safari, Chrome, FF). From what I found on the Internet, it seems to work in IE, but it does not help me.

I tried:

<iframe onreadystatechange="function();"> document.getElementById('frameId').onreadystatechange = function() {}; document.getElementById('frameId').contentDocument.onreadystatechange = function() {};

but nothing works.

Thank you for your help.

+4
source share
1 answer

So, if you want to show the message “Page loading” and hide it when iramram has finished loading, you can do something similar to the example below. Note that I used jQuery only to simplify this process. But obviously, this can be done with 100% Javascript.

I also created this on JSFiddle to show you the result. Check here !!

 <html> <head> <script type="text/javascript"> function load() { //iframe has loaded. $('div#loading').delay(1000).slideUp('slow', function() { $('div#finished').slideDown('slow').delay('2000').slideUp('slow'); $('iframe').toggle(); }); } </script> </head> <body> <div id="loading">This page is currently loading.. Just a sec please!</div> <div id="finished" style="display: none">Thanks for waiting, enjoy my website now!</div> <iframe style="display: none" onload="load()" src="your_url.php"></iframe> </body> </html> 
+7
source

All Articles