Noelia
Noelia

Reputation: 281

How to load an iframe after another iframe that has loaded

I have an array of URL's and I want to create one iframe for each URL that I have. But what I want is create and load the next iframe only when the previous was totally loaded.

This is the function that create the iframe:

function loadSubsequencePages(links){
var id = document.getElementsByTagName("iframe").length;

    for(var i=0; i<links.length;i++){
        var frame = document.createElement("iframe");
        frame.setAttribute("id","frame"+id);
        frame.setAttribute("src","about:blank");
        document.getElementById('frames').appendChild(frame);
        changeLoc(document.getElementById("frame"+id),links[i].href);
    }

}

I want to move to the next i only when the actual iframe that I create was loaded.

this is the function that change the URL:

function changeLoc(frm,loc) {
        frm.webNavigation.loadURI(loc, 
                                frm.webNavigation.LOAD_FLAGS_NONE,
                                null, null, null
                              );
    }

How can I do that?

Upvotes: 1

Views: 768

Answers (2)

Alex
Alex

Reputation: 2011

That depends.

  1. Do you have control over the pages shown in the IFRAMEs?
  2. Are they on the same domain as the hosting page?

There are four scenarios:

  • If they are on the same domain, you can access the content through JavaScript.

  • If they are on the same domain, and you can modify the loaded pages, you can tell the parent frame when the onload event fires from the page loaded in the IFRAME.

  • If they are not on the same domain, and you can modify the loaded page, security restrictions will block direct communication. But you can ping a central repository on the server from the loaded page when the onload event fires

  • If they are not on the same domain, and you can't modify the loaded page... Well you're in trouble... :) You will not be able to check when the pages have finished loading.... Well.. You could create some ugly timer loading the pages at a set interval... But don't tell anybody I told you so... ;)

Upvotes: 1

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114347

If the iframes point to a URL that is another domain, all you can do is put an onload event on your iframe - that will tell you when the Iframe starts to load, but you'll never be able to tell when the load is complete because of the Same Origin Policy. The page inside is isolated from the hosting page in this situation.

If the iframes point to the same domain, you can insert some sort of document.ready code into the page that can then call a JavaScript function in the parent page announcing that it has finished loading.

Upvotes: 1

Related Questions