JSFiddle - React, Tailwind, and code Playground

HTML

<iframe id="switchingIframe"></iframe>

CSS

html, body {
    height:100%;
}
#switchingIframe {
    width:100%;
    height:100%
}

JavaScript

var currentFrameId = 0;
var frameLengths = [0, 1000, 2000, 3000, 4000]; //The first page should be displayed as soon as ready
var frameURLs = ["https://jsfiddle.net/", "https://jsfiddle.net/", "https://jsfiddle.net/", "https://jsfiddle.net/", "https://jsfiddle.net/"];

function nextFrame() {
    if (currentFrameId == frameURLs.length) return;
    console.log((new Date().getTime()) + ": setting iframe src to " + frameURLs[currentFrameId] + "(frame id " + currentFrameId + ")");
    $('#switchingIframe').attr('src', frameURLs[currentFrameId]);
    currentFrameId++;
}

$(function () {
    console.log((new Date().getTime()) + ": starting javascript");

    $('#switchingIframe').load(function () {
        console.log((new Date().getTime()) + ": iframe loaded for frame id " + currentFrameId);
        window.setTimeout(nextFrame, frameLengths[currentFrameId]);
    });

    nextFrame();
});