Timezone Converter
The timezone converter in this article converts a specific time in any timezone to the corresponding time in any other timezone.
If your work requires you to be aware of the time in other time zones, like mine does, you'll find the converter to be a handy little tool.
I need to do time conversions often when writing and testing certain types of software. The timezone converter is on my personal portal page where it's right handy.
You're welcome to put the timezone converter on your own personal portal page or any other web page. The code is further below.
You're also welcome to bookmark this page and use the converter live right here whenever you need it.
Live Timezone Converter
To use the timezone converter:
-
Type in the time to convert.
-
Select the from and to timezones at the dropdown lists.
-
Click the arrow.
If the 12-hour clock format is used to specify a time, the converted time will also be the 12-hour format.
Specify time as hour:minute (example, 1:42)
For 12-hour clocks, append AM or PM (example, 1:42 PM)
Midnight is expressed as 0:00 or 12:00 AM.
|
Click arrow
|
||
| DST | DST | ||
UTC = Coordinated Universal Time
To find the UTC of areas not in the dropdown, see List of time zones by country.
DST = Daylight Saving Time
To determine if a certain area is on DST, here are two links.
- Countries and territories operating Daylight Saving Time (article with map)
- Daylight saving time around the world (article)
Copyright 2013 Will Bontrager Software LLC
Timezone Converter Source Code
Below is the source code, including the information and links accompanying the above live timezone converter. Paste it into your personal portal page or other web page.
No modifications need to be made to the converter source code.
<div style="display:none;">
<select id="master-dropdown-list">
<option value=""></option>
<option value="+00:00">(UTC) London, Casablanca, Dublin, Edinburgh, Lisbon, Iceland, Monrovia</option>
<option value="+01:00">(UTC+01:00) Amsterdam, Berlin, Belgrade, Bratislava, Budapest, Rome, Stockholm, Vienna</option>
<option value="+01:00">(UTC+01:00) Prague, Brussels, Bern, Copenhagen, Madrid, Paris, Sarajevo, Warsaw, Zagreb</option>
<option value="+01:00">(UTC+01:00) West Central Africa</option>
<option value="+02:00">(UTC+02:00) Cairo, Pretoria, Athens, Istanbul, Minsk, Bucharest</option>
<option value="+02:00">(UTC+02:00) Jerusalem, Harare, Helsinki, Riga, Sofia, Tallinn, Vilnius</option>
<option value="+03:00">(UTC+03:00) Nairobi, Baghdad, Kuwait, Riyadh</option>
<option value="+03:30">(UTC+03:30) Tehran</option>
<option value="+04:00">(UTC+04:00) Moscow, St. Petersburg, Volgograd, Abu Dhabi, Muscat, Baku, Tbilisi, Yerevan</option>
<option value="+04:30">(UTC+04:30) Kabul</option>
<option value="+05:00">(UTC+05:00) Islamabad, Karachi, Tashkent, Ekaterinburg</option>
<option value="+05:30">(UTC+05:30) Calcutta, Chennai, Mumbai, New Delhi</option>
<option value="+05:45">(UTC+05:45) Kathmandu</option>
<option value="+06:00">(UTC+06:00) Almaty, Novosibirsk, Astana, Dhaka, Sri Lanka</option>
<option value="+06:30">(UTC+06:30) Rangoon</option>
<option value="+07:00">(UTC+07:00) Hanoi, Jakarta, Bangkok, Novosibirsk</option>
<option value="+08:00">(UTC+08:00) Beijing, Singapore, Hong Kong, Taipei, Irkutsk, Ulaanbaatar, Perth</option>
<option value="+09:00">(UTC+09:00) Adelaide, Seoul, Osaka, Sapporo, Tokyo</option>
<option value="+09:30">(UTC+09:30) Adelaide, Darwin</option>
Kathmandu
<option value="+10:00">(UTC+10:00) Brisbane</option>
<option value="+10:00">(UTC+10:00) Melbourne, Sydney, Guam, Tasmania, Vladivostok</option>
<option value="+11:00">(UTC+11:00) Magadan, Solomon Islands, New Caledonia</option>
<option value="+12:00">(UTC+12:00) Fiji, Kamchatka, Auckland, Wellington</option>
<option value="+13:00">(UTC+13:00) Nukualofa</option>
<option value="-01:00">(UTC-01:00) Azores, Cape Verde</option>
<option value="-03:00">(UTC-03:00) Greenland, Brasilia, Buenos Aires, Newfoundland</option>
<option value="-04:00">(UTC-04:00) Atlantic Time (Canada)</option>
<option value="-04:00">(UTC-04:00) Santiago, Bolivia</option>
<option value="-04:30">(UTC-04:30) Caracas</option>
<option value="-05:00">(UTC-05:00) Haiti, Bogota, Lima, Quito</option>
<option value="-05:00">(UTC-05:00) Eastern Time (US and Canada)</option>
<option value="-06:00">(UTC-06:00) Central Time (US and Canada)</option>
<option value="-06:00">(UTC-06:00) Mexico City</option>
<option value="-07:00">(UTC-07:00) Mountain Time (US and Canada)</option>
<option value="-08:00">(UTC-08:00) Pacific Time (US and Canada), Tijuana</option>
<option value="-09:00">(UTC-09:00) Alaska</option>
<option value="-10:00">(UTC-10:00) Hawaii, Aleutian Islands</option>
<option value="-11:00">(UTC-11:00) Midway Island, American Samoa</option>
</select>
</div>
<div style="border:1px solid black; padding:15px; width:335px;">
<form style="margin:0px;" onsubmit="return false;">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3">
<div style="width:328px;">
<p style="margin:0px 0px 6px 1em; text-indent:-1em;">
Specify time as hour:minute <span style="white-space:nowrap;">(example, 1:42)</span>
</p>
<p style="margin:0px 0px 6px 1em; text-indent:-1em;">
For 12-hour clocks, append AM or PM <span style="white-space:nowrap;">(example, 1:42 PM)</span>
</p>
<p style="margin:0px 0px 6px 1em; text-indent:-1em;">
Midnight is expressed as 0:00 or <span style="white-space:nowrap;">12:00 AM.</span>
</p>
</div>
</td>
</tr>
<tr>
<td>
<input id="tzinput-left" style="width:150px;" value="Type time here" onclick="if(this.value=='Type time here'){this.value='';}">
</td>
<td rowspan="3" style="padding-left:7px; padding-right:7px;">
<span onclick="UpdateTimezoneFields()" style="cursor:pointer;">
<img src="//www.willmaster.com/library/images/rightTriangle.png" style="height:50px; width:15px;" alt="right arrow for calculating results">
</span>
</td>
<td colspan="2" align="right">
<div id="tzinput-right" style="width:148px; height:15px; border:1px solid black; padding:3px 0px 7px 0px; font-size:larger; text-align:center;">
<div style="font-size:13px; white-space:nowrap;">Click arrow to convert.</div>
</div>
</td>
</tr>
<tr>
<td align="center">
<input type="checkbox" id="tzdst-left">DST
</td>
<td align="center">
<input type="checkbox" id="tzdst-right">DST
</td>
</tr>
<tr>
<td>
<select id="tzlist-left" style="width:155px;"></select>
</td>
<td>
<select id="tzlist-right" style="width:150px;"></select>
</td>
</tr>
<tr>
<td colspan="3">
<div style="width:328px;">
<p style="margin:6px 0px 0px 1em; text-indent:-1em;">
UTC = Coordinated Universal Time<br>
To find the UTC of areas not in the dropdown, see <a target="_blank" href="http://wikipedia.org/wiki/Time_zones_by_country">List of time zones by country</a>.
</p>
<p style="margin:6px 0px 0px 1em; text-indent:-1em;">
DST = Daylight Saving Time<br>
To determine if a certain area is on DST, here are two links.
</p>
<ul style="margin:0px;">
<li style="margin-top:6px;">
<a target="_blank" href="http://www.worldtimezone.com/daylight.html">Countries and territories operating Daylight Saving Time</a> (article with map)
</li>
<li style="margin-top:6px;">
<a target="_blank" href="http://wikipedia.org/wiki/Daylight_saving_time_around_the_world">Daylight saving time around the world</a> (article)
</li>
</ul>
<p style="margin:6px 0px 0px 1em; text-indent:-1em;">
Copyright 2013 <a href="//www.willmaster.com">Will Bontrager Software LLC</a>
</p>
</div>
</td>
</tr>
</table>
</form>
</div>
<script type="text/javascript">
var mastersel = document.getElementById("master-dropdown-list");
var rightselopt = document.getElementById("tzlist-right").options;
var leftselopt = document.getElementById("tzlist-left").options;
for( i=0; i<mastersel.options.length; i++ )
{
rightselopt[rightselopt.length] = new Option(mastersel.options[i].text,mastersel.options[i].value);
leftselopt[leftselopt.length] = new Option(mastersel.options[i].text,mastersel.options[i].value);
}
var APM = '';
function UpdateTimezoneFields()
{
APM = '';
var fromtime = document.getElementById("tzinput-left").value;
var fromdrop = document.getElementById("tzlist-left").options[document.getElementById("tzlist-left").selectedIndex].value;
var todrop = document.getElementById("tzlist-right").options[document.getElementById("tzlist-right").selectedIndex].value;
if( ! (fromtime.length && fromdrop.length && todrop.length) )
{
alert('The time to convert from and both dropdowns all need to be specified.');
return;
}
fromtime = ConformTime(fromtime);
fromtime = ConvertTo24hourClock(fromtime);
if( document.getElementById("tzdst-left").checked ) { fromtime = DSTadjustment(fromtime,false); }
var totime = ConvertToFromGMT(fromtime,fromdrop,true);
totime = ConvertToFromGMT(totime,todrop,false);
if( document.getElementById("tzdst-right").checked ) { totime = DSTadjustment(totime,true); }
totime = ConvertTo12hourClock(totime);
document.getElementById("tzinput-right").innerHTML = totime;
} // function UpdateTimezoneFields()
function ConvertTo24hourClock(tm)
{
if( ! APM.length ) { return tm; }
var ta = tm.split(":",2);
var h = Math.abs(parseInt( ta[0].replace(/\D/g,"") ));
var m = Math.abs(parseInt( ta[1].replace(/\D/g,"") ));
if( ( APM.substr(-2) == "AM" ) && h == 12 ) { h = 0; }
else if( ( APM.substr(-2) == "PM" ) && h < 12 ) { h += 12; }
return h + ":" + MinimumTwoDigits(m);
} // function ConvertTo24hourClock()
function ConvertTo12hourClock(tm)
{
if( ! APM.length ) { return tm; }
var ta = tm.split(":",2);
var h = Math.abs(parseInt( ta[0].replace(/\D/g,"") ));
var m = Math.abs(parseInt( ta[1].replace(/\D/g,"") ));
var localapm = " AM";
if( h == 0 ) { h = 12; }
else if( h >= 12 )
{
localapm = " PM";
if( h > 12) { h -= 12; }
}
return h + ":" + MinimumTwoDigits(m) + localapm;
} // function ConvertTo12hourClock()
function ConformTime(tm)
{
var ta = tm.split(":",2);
var am = /am/i.test(ta[1]) ? true : false;
var pm = /pm/i.test(ta[1]) ? true : false;
if( am && pm ) { am = false; }
if( am ) { APM = " AM"; }
else if( pm ) { APM = " PM"; }
var h = Math.abs(parseInt( ta[0].replace(/\D/g,"") ));
var m = Math.abs(parseInt( ta[1].replace(/\D/g,"") ));
if( am || pm )
{
if( h == 0 ) { h = 12; }
else if( h > 12 ) { return MessageNow("Hour number for 12-hour clock can't be more than 12"); }
}
else if( h > 23 ) { return MessageNow("Hour number can't be more than 23. Use 0 for beginning of day."); }
return h + ":" + MinimumTwoDigits(m) + APM;
} // function ConformTime()
function DSTadjustment(tm,add)
{
var ta = tm.split(":",2);
var h = parseInt(ta[0]);
var m = parseInt(ta[1]);
if( add ) { h++; }
else { h--; }
if( h < 1 ) { h = 23; }
else if( h > 23 ) { h = 0; }
return h + ":" + MinimumTwoDigits(m);
} // function DSTadjustment()
function ConvertToFromGMT(tm,val,from)
{
var plus = (val.substr(0,1)=="+") ? true : false;
if( from ) { plus = (!plus); }
var ta = val.split(":",2);
var fh = Math.abs(parseInt( ta[0].replace(/\D/g,"") ));
var fm = Math.abs(parseInt( ta[1].replace(/\D/g,"") ));
ta = tm.split(":",2);
var h = Math.abs(parseInt( ta[0].replace(/\D/g,"") ));
var m = Math.abs(parseInt( ta[1].replace(/\D/g,"") ));
if( plus ) { h += fh; m += fm; }
else { h -= fh; m -= fm; }
if( m > 59 ) { h++; m -= 60; }
if( m < 0 ) { h--; m += 60; }
if( h > 23 ) { h -= 24; }
if( h < 0 ) { h += 24; }
return h + ":" + MinimumTwoDigits(m);
} // function ConvertToGMT()
function MinimumTwoDigits(n)
{
var s = new String(n);
while( s.length < 2 ) { s = "0" + s; }
return s;
} // function MinimumTwoDigits()
function MessageNow(s)
{
alert(s);
return '';
} // function MessageNow()
</script>
Customizing the Dropdown List
Although it isn't necessary to modify anything in the source code, you may wish to customize the dropdown list for yourself.
The dropdown list is specified in the select field near the top of the source code. It's in a div with style display:hidden and it's the only place the dropdown list needs to be modified.
The Javascript puts a copy of that one dropdown list into the two places seen in the timezone converter.
Arrange the dropdown list as you please. Add or remove options. Change the option text/labels. Modify the list to whatever makes it easier for you to use.
There is a requirement, though. The option values must have a specific format.
Here is an example of an option:
<option value="+06:30">(UTC+06:30) Rangoon</option>
In that example line, the value is "+06:30" and that format must be maintained.
The first character of the value is either a "+" or a "-" (hyphen). Following that is ##:##, where the first "##" is the number of hours to adjust relative to UTC and the second "##" is the number of minutes to adjust. (If the number or hours and minutes are both zero, the value can be specified as "+00:00" or as "-00:00".)
The Converter
The timezone converter converts any specified time from any timezone to any other timezone.
It can be used right here in this article. Bookmark it or post it in one of your social media accounts so the link is handy.
The converter may also be used on your own personal porter page or other web page. Copy the timezone converter source code and paste it into the source code of your web page.
It's a handy tool, easy to use.
Will Bontrager
