PDA

View Full Version : Current Running Time with Javascript



chirag.khatri
05-15-2009, 12:44 PM
1) CODE TITLE: Display Current Time with JS

2) AUTHOR NAME/NOTES: Chirag S Khatri

3) DESCRIPTION: This script shows the current time continues on your webpage without refreshing the page.

4) URL TO CODE:

<script type="text/javascript">

<!-- Put the following code in your JS file or Head Tags ---->
<!--

function DisplayTime(){
if (!document.all && !document.getElementById)
return
timeElement=document.getElementById? document.getElementById("curTime"): document.all.tick2
var CurrentDate=new Date()
var hours=CurrentDate.getHours()
var minutes=CurrentDate.getMinutes()
var seconds=CurrentDate.getSeconds()
var DayNight="PM"
if (hours<12) DayNight="AM";
if (hours>12) hours=hours-12;
if (hours==0) hours=12;
if (minutes<=9) minutes="0"+minutes;
if (seconds<=9) seconds="0"+seconds;
var currentTime=hours+":"+minutes+":"+seconds+" "+DayNight;
timeElement.innerHTML="<font style='font-family:verdana, arial,tahoma;font-size:12px;color:#E25984; font-weight:bold;'>"+currentTime+"</b>"
setTimeout("DisplayTime()",1000)
}
window.onload=DisplayTime
</script>

// -->

<!-- Put the following code in your web page where you want to show the time ---->
<span id=curTime></span>

View Demo (http://www.freewebs.com/khatrichirag/currenttimewithjs.htm)
or, ATTACHED BELOW (see #3 in guidelines below):

jelzo
06-21-2009, 07:30 PM
Small bump. I changed the script slightly for EU users who dont want the AM/PM sht. ;)


<script type="text/javascript">

<!-- Put the following code in your JS file or Head Tags ---->
<!--

function DisplayTime(){
if (!document.all && !document.getElementById)
return
timeElement=document.getElementById? document.getElementById("curTime"): document.all.tick2
var CurrentDate=new Date()
var hours=CurrentDate.getHours()
var minutes=CurrentDate.getMinutes()
var seconds=CurrentDate.getSeconds()
if (minutes<=9) minutes="0"+minutes;
if (seconds<=9) seconds="0"+seconds;
var currentTime=hours+":"+minutes+":"+seconds;
timeElement.innerHTML="<font style='font-size:12px;font-weight:bold;'>"+currentTime+"</b>"
setTimeout("DisplayTime()",1000)
}
window.onload=DisplayTime
</script>


// -->

<!-- Put the following code in your web page where you want to show the time ---->
<span id=curTime></span>

Remember, Chirag S Khatri is still the author!

aghiban
09-24-2013, 04:56 AM
HEy, here is a French version of this. You can actually change this to any language. Just took your code and rewrote it for one of my classes. Thought I should share.


function DisplayTime(){
var CurrentDate=new Date(); //get date and distribute
var hours=CurrentDate.getHours();
var minutes=CurrentDate.getMinutes();
var seconds=CurrentDate.getSeconds();
if (minutes<=9) minutes="0"+minutes; // make sure that there is consistency in display
if (seconds<=9) seconds="0"+seconds;
if (hours<=9) hours="0"+hours;
var day=CurrentDate.getDay();
var monthday=CurrentDate.getDate();
var month=CurrentDate.getMonth();
var jours=new Array("Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi"); //Frech addon for days
var mois=new Array("Janvier","Fevrier","Mars","Avril","Mai","Juin","Juillet","Aout","Septembre","Octobre","Novbembre","Decembre"); //French addon for months
var annee=CurrentDate.getFullYear();
var currentTime=jours[day]+" le "+monthday+" "+mois[month]+" "+annee+" "+hours+":"+minutes+":"+seconds;
document.getElementById("curTime").innerHTML=currentTime;
setTimeout("DisplayTime()",1000);
}
window.onload=DisplayTime;
/*end*/

OK, hope this helps.