CODEWITHSUNDEEP
javascriptjqueryhtmltime
user3128861
user3128861

Reputation: 121

Current Time (Javascript) In HTML

Hi currently I had a javascript that display current time. Is a example taken from the internet. How do I go about doing it such that the current time displayed is 5mins behind the actual time. Don't really know how the time works. Tried to change some numbers but to no avail.

Currently this is the code.

 $(document).ready(function() 
{   
    var MONTHS = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ],
        DAYS = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];

    var date = new Date(new Date().getTime() - (5 * 60 * 1000));

    $('#date').text(DAYS[date.getDay()] + " " + date.getDate() + ' ' + MONTHS[date.getMonth()] + ' ' + date.getFullYear());

    function zeroPad(val) {
        return ((val < 10) ? "0" : "" ) + val;
    }

    setInterval(function() {
        var fiveMinutesAgo = new Date(new Date().getTime() - (5 * 60 * 1000));
        $("#hours").text(zeroPad(fiveMinutesAgo.getHours()));
        $("#min").text(zeroPad(fiveMinutesAgo.getMinutes()));
        $("#sec").text(zeroPad(fiveMinutesAgo.getSeconds()));
    }, 1000);
});

Upvotes: 3

Views: 501

Answers (4)

John S
John S

Reputation: 21482

Try:

var nowMinusFiveMinutes = new Date(Date.now() - (5 * 60 * 1000));

Note:

  1. Calling Date.now() gets the number of milliseconds since the epoch (Jan 1, 1970).
  2. (5 * 60 * 1000) is the number of milliseconds in 5 minutes.
  3. You can construct a date by using new Date(numberOfMillisecondsSinceTheEpoch).

UPDATE:

I don't see the need for three separate setInterval() calls. Couldn't you update the three elements in one call, like this?

Upvotes: 2

immayankmodi
immayankmodi

Reputation: 8580

try to minus no of minutes that you want to... 

setInterval( function() {
// Create a newDate() object and extract the minutes of the current time on the visitor's
var minutes = new Date().getMinutes();
minutes = minutes - 5; // here you can minus or add minutes as per your requirements
// Add a leading zero to the minutes value
$("#min").html(( minutes < 10 ? "0" : "" ) + minutes);
},1000);

UPDATED

var currDateTime = new Date(),
    hr = currDateTime.getHours(),
    min = currDateTime.getMinutes(),
    dd = currDateTime.getDate(),
    mm = currDateTime.getMonth() + 1,
    yyyy = currDateTime.getFullYear();

//adding pad while getting singles in date or month between 0-9
if(dd < 10){ dd = '0' + dd}     if(mm < 10){ mm = '0' + mm} 

//current date and time as per UTC format
currDateTime = yyyy +'/'+ mm +'/'+ dd +" "+ hr + ':' + min + ":00";
$("#currDateTime").text(new Date(currDateTime).toUTCString());

//minus -5 minutes to actual date and time
currDateTime = yyyy +'/'+ mm +'/'+ dd + " "+ hr + ':' + (min - 5) + ":00";
$("#minusDateTime").text(new Date(currDateTime).toUTCString());

//we are now going to add +5 min to currDateTime
currDateTime = yyyy +'/'+ mm +'/'+ dd + " "+ hr + ':' + (min + 5)+ ":00";
$("#addDateTime").text(new Date(currDateTime).toUTCString());

This way you can add or minus no of hours, minutes, days, months, years to specific objects as per requirements..

Let me know for further clarifications?

Hope it would helps! Thanks

Here is a JSFiddle demo

Upvotes: 1

user2053036
user2053036

Reputation:

The code is setting the minutes on the line 

 var minutes = new Date().getMinutes();

You can do 

var minutes = new Date().getMinutes() - 5;

So that time displayed is 5 mins behind the actual time. I would recommend you to read this to know more about Javascript Date

Upvotes: 1

Sterling Archer
Sterling Archer

Reputation: 22395

You can convert the date to time in milliseconds, and subtract 5 minutes worth of milliseconds (1 min = 60k milliseconds = 5 minutes/300k milliseconds).

var x = new Date;
x = x.valueOf();
x -= 300000;

And then convert that however you wish.

Upvotes: 1

Related Questions