Search code examples
javascriptswitch-statementnavigator

Use JavaScript to automatically navigate to a set list of pages

I have created a dashboard which displays real time information for the status of each environment.

As this is going to be displayed on a large monitor I would like it to automatically switch between a set list of pages, preferably in a JavaScript array.

eg.

["page1.html", "page2.html", "page3.html", "page4.html", ... ]

When I am on page1, I would like it to load page2 after a couple of minutes. After a couple of minutes on page2 I then want it to load page3 etc...

I understand how to do the actual page switch, but I am having trouble with figuring out how to get the page to use the next entry in the array.

Solution

  • The most simple and convenient method would be, to have or to create an <iframe> element (respectively a new window instance) and remotely access that document from your parent site.

    So let's say we have an <iframe>, we access that via Javascript in a way like

    var iframe = document.getElementById('myiframe'),
    pages  = ["page1.html", "page2.html", "page3.html", "page4.html" ];

iframe.src = pages[ 0 ];

    All you would have left to do is to implement a Timer-loop using setTimeout or so to iterate through the array entries.