I would like my homepage to change each day at a specific time (1pm).

The page has a 24hr countdown timer and when it reaches zero, I would like a new page to load and the timer starts again.

I understand how to make a page refresh after a particular time

<script>
    setTimeout(function(){
       window.location='Page2.html';
    }, 5000);
</script>

But not how to make this happen at a particular time of the day (1pm).

I would like my homepage to change each day at a specific time (1pm).

The page has a 24hr countdown timer and when it reaches zero, I would like a new page to load and the timer starts again.

I understand how to make a page refresh after a particular time

<script>
    setTimeout(function(){
       window.location='Page2.html';
    }, 5000);
</script>

But not how to make this happen at a particular time of the day (1pm).

• javascript

• Is it the page content you wish to change? Does the page content e from a db? – Professor Abronsius Commented Sep 11, 2016 at 7:07
• Try learning about cron jobs – muya.dev Commented Sep 11, 2016 at 7:08
• As the site develops, I will build a SQL database, but at present, I design and upload the new page for each day. – Paul Hesketh Commented Sep 11, 2016 at 7:11
• Cron jobs won't really help unless he is using web sockets since the server can't push data via http – Dan Commented Sep 11, 2016 at 7:11
• I think this link may help you out. – rcr Commented Sep 11, 2016 at 7:17

5 Answers 5

You can try using a getting the current time on page load/refresh. Then calc the milliseconds until 1pm. And use that to set your setTimeout. I suggest using a library like moment to do time calculations.

Load moments in your html:

<script src="https://cdnjs.cloudflare./ajax/libs/moment.js/2.16.0/moment.min.js"></script>

In JS:

// time right now
var now = moment.now();
// set refresh hour to 1pm
var nextRefresh = moment.now().hour(13).minute(0).second(0).millisecond(0);

// check if is or after 1pm
if (now.hour >= 13) {
  nextRefresh.add(1, 'days'); // add 1 day
}

setTimeout(function() {
  console.log('next 1pm');
}, nextRefresh.diff(now));

And @Stoycho Trenchev is right. You will probably want to call setInterval with 86400000 ms in the setTimeout. This way, your page will refresh everyday afterwards.

You need setInterval not setTimeout and you need to calculate 24h in milliseconds :)

Here you go just a fyi JavaScript uses the browsers time so just because it's 1pm where you are it won't be 1pm where the user is.

var intervalId = window.setInterval(checkTime, 500);

function checkTime() {

    var d = new Date();
    var h = d.getHours();
    var m = d.getMinutes();
    var s = d.getSeconds();

    if(h == 13 && m == 0 && s == 0) return window.location='Page2.html';
}

Ah. Something like?

<script>
    function getTime() {
        var date    = new Date()
        var time    = date.getTime();
        var hours   = time.getHours();
        var minutes = time.getMinutes();
        var seconds = time.getSeconds();

        var time    = {'hours': hours, 'minutes': minutes, 'seconds': seconds};
    }

    setInterval(function() {
        var time    = getTime();

        if (time.hours === 13 && time.minutes === 0) {
             window.location = 'Page2.html';
        }
    }, 500);
</script>

You'll need setTimeout to set a timer and Date to calculate how long the timer needs to go until it triggers.

var now = new Date();
var millisTill10 = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 10, 0, 0, 0) - now;
if (millisTill10 < 0) {
     millisTill10 += 86400000; // it's after 10am, try 10am tomorrow.
}
setTimeout(function(){alert("It's 10am!")}, millisTill10);