CODEWITHSUNDEEP
javascriptjqueryajax
Joe
Joe

Reputation: 3

How to reload content according exac time without refreshing the page

I'm preparing simple digital signage script which require time scheduling. I was able to do it with javascript with refreshing every 15 minutes. But my question is, how can I measure the time and change the content on exact hour without refreshing the page?

My page looks like this:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="refresh" content="900" >
<title>Signage</title>
<style>
body {
   margin: 0;
   padding: 0;
}
</style>
<script>
function src() { 
    var Day = "day.html";
    var Lunch = "lunch.html";
    var Evening = "evening.html";
    var Src;

    var hour = new Date().getHours();
    var day = new Date().getDay();

    if (hour >= 10 && hour <= 13 && day >= 1 && day <=5) {
        Src = Lunch;    
    }       

    else if (hour >= 7 && hour <= 19)   {
        Src = Day;
            }

    else  {
        Src = Evening;
            }

document.getElementById('signage').src = Src; 

}

</script>

</head>
<body onLoad="src();">
<iframe scrolling="no" id="signage" src="about:blank" width="1920" height="1080" frameborder="0"></iframe>

</body>
</html>

Upvotes: 0

Views: 576

Answers (2)

Krzysztof Bargieł
Krzysztof Bargieł

Reputation: 143

Try to add this code in head

<script> document.addEventListener("DOMContentLoaded", setTimeout(function() {src();}, 5000 /*5 sec*/)); </script>

Upvotes: 0

Akash Tomar
Akash Tomar

Reputation: 970

If you want your page to refresh automatically after a certain time period, you can use javascript's setInterval() function.

setInterval(function() { window.location.reload(); } , timePeriod );

Upvotes: 2

Related Questions