I want to create html page with interesting feature. Page load IFRAME with image lets say image1.jpg, but if loading this image take more then 100ms i want to load iframe with image2.jpg.
I tried to do it all day, is it possible?
<html>
<body>
<iframe id="frameid" width="310" height="255" src="image1.jpg"></iframe>
<script language="javascript">
iframe = document.getElementById("frameid");
var t0 = new Date();
var t00 = t0.getMilliseconds();
WaitForIFrame();
var t1 = new Date();
var t11 = t1.getMilliseconds();
var t2 = t11-t00;
if(t2 > 100) { remove()}
function WaitForIFrame() {
if (iframe.readyState != "complete") {
setTimeout(function() {window.frames[0].stop();},60);
}
else {
done();
}
}
function done() {
//some code after iframe has been loaded if you want
}
function remove(){
var frame = document.getElementById("frameid");
frame.parentNode.removeChild(frame);
}
</script>
</body>
</html>
I tried to compare two times and then remove one iframe, but its sth wrong with this idea
