PDA

View Full Version : Cycle through webpages


dbepp
11-04-2014, 03:41 PM
I have a television in our sales department that I would like to cycle information through.. such as our shipping calendar (gmail calendar), sales goals, etc.. all of which are located on separate webpages. Is there a way to cycle through these pages by using HTML?
If not, any other suggestions?

dbepp
11-04-2014, 05:59 PM
I found something like this.. but can't seem to get the pages to actually display.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Dashboard Example</title>
<style type="text/css">
body, html { margin: 0; padding: 0; width: 100%; height: 100%; overflow: hidden; }
iframe { border: none; }
</style>
<script type="text/javascript">
var Dash = {
nextIndex: 0,

dashboards: [
{url: "http://www.google.com", time: 5},
{url: "http://www.yahoo.com", time: 5},
{url: "http://www.stackoverflow.com", time: 5}
],

display: function()
{
var dashboard = Dash.dashboards[Dash.nextIndex];
frames["displayArea"].location.href = dashboard.url;
Dash.nextIndex = (Dash.nextIndex + 1) % Dash.dashboards.length;
setTimeout(Dash.display, dashboard.time * 1000);
}
};

window.onload = Dash.display;
</script>
</head>
<body>
<iframe name="displayArea" width="100%" height="100%"></iframe>
</body>
</html>

edbr
11-05-2014, 01:36 AM
[heres one that works i just mashed it a bit it tests ok

<html>
<head>
<title></title>
<style type="text/css">
.show{ height:1000px; width:800px;}
</style>
<script type="text/javascript">
var urls = [
"http://www.concord-bali-villas.com/index.php"
,"http://www.concord-bali-villas.com/reizen/index.php"
,"http://www.concord-bali-villas.com/urlaub/index.php"
,"http://www.dreamweaverclub.com/forum"
];



function showUrl(idx) {

var f = document.getElementById("f");

// call the next load after 5 seconds only after
// this iframe loads
f.onload = function() {
var next = ++idx % urls.length;
setTimeout(function(){
showUrl(next);
}, 5000);
}
// set the src
f.src = urls[idx];
}

</script>
</head>
<body onload="showUrl(0)" class="app-chrome">
<iframe class="show" id="f" src="about:blank"></iframe>
</body>
</html>

edbr
11-05-2014, 01:37 AM
it is also possible with jquery and yu can add transiions

dbepp
11-05-2014, 06:37 PM
Works perfectly, thank you! Except when I change out the webpages you have used, the new ones don't seem to appear. For testing purposes, I've used google and gmail.. it simply shows a blank screen. Thoughts?

<html>
<head>
<title></title>
<style type="text/css">
.show{ height:800px; width:900px;}
</style>
<script type="text/javascript">
var urls = [
"http://www.gmail.com"
,"http://www.google.com"
,"http://www.concord-bali-villas.com/urlaub/index.php"
,"http://www.dreamweaverclub.com/forum"
];



function showUrl(idx) {

var f = document.getElementById("f");

// call the next load after 5 seconds only after
// this iframe loads
f.onload = function() {
var next = ++idx % urls.length;
setTimeout(function(){
showUrl(next);
}, 5000);
}
// set the src
f.src = urls[idx];
}

</script>
</head>
<body onload="showUrl(0)" class="app-chrome">
<iframe class="show" id="f" src="about:blank"></iframe>
</body>
</html>

edbr
11-06-2014, 02:07 AM
well they do use https, so not sure if thats a problem or not

edbr
11-06-2014, 02:53 AM
ah found this
Google is sending an "X-Frame-Options: SAMEORIGIN" response header you cannot simply set the src to "http://www.google.com" in a iframe.

dbepp
11-06-2014, 01:11 PM
ah found this
Google is sending an "X-Frame-Options: SAMEORIGIN" response header you cannot simply set the src to "http://www.google.com" in a iframe.

Awesome, thanks!