0

I am trying to get the users local time and subtract it with my own to get the time difference as an output.

This is what I have so far: 

var myTimezone = new Date();
var usersTimezone = 0; // UsersTimezone is missing
var timeDifference = myTimezone.getHours() - usersTimezone + " hours";

document.getElementById("time").innerHTML = "Time Difference: " + timeDifference;
<div id="time">

</div>

I couldn't find a good solution to get the exact local time of the user, so maybe someone could help me here.

Thank you very much!

Dennis
  • 137
  • 1
  • 2
  • 14
  • How would the user know about your time zone? When you create a new `Date` its created at the user, so you would need to ask the server for its `Date` using `ajax` or setting it when rendering the page – Pavlo Mar 18 '18 at 18:25
  • Since it's javascript, it will be the user's timezone, you could retain yours by a server side language – dev8080 Mar 18 '18 at 18:26

1 Answers1

1

Easy way: without daylight saving time

Like explained here there is a function getTimezoneOffset() to get the timezone of the user.

But you have to know in witch timezone you are, in my example you are in the timezone UTC+0.

var myTimezone = 1;
var usersTimezone =  (new Date()).getTimezoneOffset() / 60;
var timeDifference = Math.abs(myTimezone + usersTimezone) + " hours";

document.getElementById("time").innerHTML = "Time Difference: " + timeDifference;
<div id="time">

</div>

Calculation with daylight saving time

The code below also looks at he daylight saving time. This is more complex and i used the momentjs for this.

Take also a look at this post: https://stackoverflow.com/a/29268535/2801860

var now = moment();
var usersOffset = now.utcOffset();
now.tz("Europe/Berlin"); // your time zone, not necessarily the server's
var myOffset = now.utcOffset();
var diffInMinutes = Math.abs(usersOffset - myOffset);
document.getElementById("time").innerHTML = "Time Difference: " + (diffInMinutes/60);
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.21.0/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.21.0/moment-with-locales.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.14/moment-timezone.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.14/moment-timezone-with-data.min.js"></script>

<div id="time">

</div>
fab
  • 1,189
  • 12
  • 21
  • 1
    Thank you very much, this totally makes sense for me. I'm located in Germany so UTC would be +1 – Dennis Mar 18 '18 at 18:34
  • do I need to have -1 as my timezone var ? Because +1 shows me a time difference of 2 hours. – Dennis Mar 18 '18 at 18:36
  • sorry, the calculation was wrong, now it works - Germany is UTC+1 – fab Mar 18 '18 at 18:42
  • NICE! Thanks for this.. .What causes the problem with the calculation before? – Dennis Mar 18 '18 at 18:43
  • Hi fab. thanks again. I just noticed one thing, today the time changed from winter into summertime and the time difference went from 0h to 1h. Is there a way to fix this? :) – Dennis Mar 25 '18 at 09:22
  • @Dennis I updated the post with a example that also take care at the daylight saving time (sommertime, ..) – fab Mar 25 '18 at 10:17
  • NICE ! Thanks for this! – Dennis Mar 25 '18 at 10:46