Telling when an iframe is done loadingWhen using <iframes> is it often useful to know when the contents of the frame is done loading. There are two ways to do this.
The first way, which is by far the simplest is to add an onLoad event to the <iframe>. Something like this: <iframe id="testIframe" src="somepage" onload="functionToCallAfterLoading();"></iframe> For an iframe like this, functionToCallAfterLoading will call every time the content of the iframe is loaded. This includes loads that occur after the initial page load. The only problem with this technique is that some older browsers don't support it. If you are not supporting older browsers (IE5, early Opera, etc), don't worry about it. If you need to support older browsers, you can get a handle to the iframe element and check the state of document.readyState, once this reaches complete, the iframe has completed loading. Of course, this downside to this is that you need to keep checking. One way to do this is to schedule a proc to run every 100 milliseconds or so. If it finds that it is done, it calls the function you want called when the iframe is loaded, if not it calls itself again on a delay. Here's an example of such a function:
function checkIframeLoading() {
// Get a handle to the iframe element
var iframe = document.getElementById('testIframe');
// Check if loading is complete
if ( iframe.document.readyState == 'complete' ) {
// The loading is complete, call the function we want executed once the iframe is loaded
functionToCallAfterLoading();
return;
}
// If we are here, it is not loaded. Set things up so we check the status again in 100 milliseconds
window.setTimeout('checkIframeLoading();', 100);
}
Using either of these methods will allow you to know, and take an action, when an <iframe> element has completed loading. The first method is by far the easier of the two, but it is not supported by very old browsers.
|

