How to refresh cycle multiple website page under one browser ?
eg. I have several internal custom design website that I'd like to display in the large LCD panel for my user, kind of screensaver like but this is cycling through several web URL in full screen windows (F11)
How to refresh cycle multiple website page under one browser ?
eg. I have several internal custom design website that I'd like to display in the large LCD panel for my user, kind of screensaver like but this is cycling through several web URL in full screen windows (F11)
Share Improve this question edited Oct 5, 2019 at 11:19 halfer 20.4k19 gold badges108 silver badges201 bronze badges asked Dec 2, 2010 at 13:51 Senior Systems EngineerSenior Systems Engineer 1,1414 gold badges36 silver badges81 bronze badges3 Answers
Reset to default 12I agree with SLaks. You can use an iframe to load sites into your page and control which pages you show. You won't be able to control anything inside of the iframe but you will be able to show it. Also be careful of sites that will bust out of the iframe like stackoverflow.
Here is an example that I built that I thought would be helpful in illustrating how this can be done. There is lots more that could be added to this to make it really cool, or it can be keept really simple.
Example page => http://mikegrace.s3.amazonaws./forums/stack-overflow/example-show-multiple-pages-like-screensaver.html
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis./ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8">
var sites = [
"http://www.thinkgeek./",
"http://www.artzstudio./2009/04/jquery-performance-rules/",
"http://www.example."
];
var currentSite = sites.length;
$(document).ready(function () {
var $iframe = $("iframe").attr("src","http://www.google.");
setInterval(function() {
(currentSite == 0) ? currentSite = sites.length - 1 : currentSite = currentSite -1;
$iframe.attr("src",sites[currentSite]);
}, 7000);
});
</script>
<style type="text/css" media="screen">
iframe {
height: 100%;
width: 100%;
border: none;
}
</style>
</head>
<body>
<iframe></iframe>
</body>
</html>
You can make an <iframe> tag, then use Javascript to set its src in a setInterval callback.
One efficient way is to have one master window and some slaves one. The master window will trigger an event to the slave one (up to you then to do what you want). In that manner they should always be synchronized (which I can imagine it important in your case). Look at this post to see how to achieve this task