<!DOCTYPE html> <html> <head> <script> function $(str) { return document.getElementById(str); } function hookLoad(str) { $(str).onload = function() { window.parent.loadEnded(); }; window.parent.loadStarted(); } window.onload = function() { hookLoad("w"); $("w").contentWindow.location.href = "passinner.png"; hookLoad("x"); var doc = $("x").contentDocument; doc.write('<img src="passinner.png">'); doc.close(); }; function doIt() { hookLoad("y"); $("y").contentWindow.location.href = "passouter.png"; hookLoad("z"); var doc = $("z").contentDocument; doc.write('<img src="passouter.png">'); doc.close(); } </script> </head> <body> <iframe name="w" id="w" width="100" height="100"></iframe> <iframe name="x" id="x" width="100" height="100"></iframe> <iframe name="y" id="y" width="100" height="100"></iframe> <iframe name="z" id="z" width="100" height="100"></iframe> <img src="passinner.png"> </body> </html>