Display USA Standard Day, Date, and Time On Your Website

Published by Kevin T.
clock1

The following is a method using JavaScript to display the United States standard day, date and time format on your website. This code will update the time without requiring a refresh.
I am leaving the css in the style tag for this example, however it is recommended that you put it in a .css file and call them with the class tag.
Copy and paste the following code into a text file and name it: date_time.js. Upload this file to your server.

function date_time(id) {
date = new Date;
year = date.getFullYear();
month = date.getMonth();
months = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');
d = date.getDate();
day = date.getDay();
days = new Array('Sunday','Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday');
h = date.getHours();
suffix = 'AM';
if(h>=12) { suffix = 'PM'; }
if(h==0) { h = 12; }
if(h>12) { h = h-12; }
m = date.getMinutes();
if(m<10) { m = "0"+m; } result = ''+days[day]+', '+months[month]+' '+d+', '+year+' '+h+':'+m+' '+suffix; document.getElementById(id).innerHTML = result; setTimeout('date_time("'+id+'");','1000'); return true; }

Put this line within the HEAD section of your HTML file. Change ‘yourwebsite’ to the address where you will be storing the date_time.js file.

<script type=”text/javascript” src=”http://www.yourwebsite.com/date_time.js”></script>

Insert this code into the BODY section of your HTML file, positioned exactly where you want the date and time displayed.

<div id=”date_time” style=”color:#333333; font-weight:bold; font-size:1em;”></div>
<script type=”text/javascript”>window.onload = date_time('date_time');</script>

And the code in action: