Website HTML Javascript Clock

3:34:00 PM | ,


This generator allows you to create the Javascript code necessary to put a text clock on your
 website that can display the current time (and date). The clock keeps updating in real time.
 Multiple time and date formats to choose from.


  1. Select how you want your clock/calendar to look
  2. Generate the HTML and JavaScript code for your clock (button at bottom)
  3. Preview your clock at the bottom above the code
  4. Copy and Paste the Source Code into your HTML page


If you want to change the size, font, or color you can edit the last line of your generated
 code and add a style="" property like:
<div id="clockbox" style="font:14pt Arial; color:#FF0000;"></div>

    Text Clock Format
    <script type="text/javascript"> tday  =new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"); tmonth=new Array("January","February","March","April","May","June","July","August","September","October","November","December"); function GetClock(){ d = new Date(); nday   = d.getDay(); nmonth = d.getMonth(); ndate  = d.getDate(); nyear = d.getYear(); nhour  = d.getHours(); nmin   = d.getMinutes(); nsec   = d.getSeconds(); if(nyear<1000) nyear=nyear+1900;      if(nhour ==  0) {ap = " AM";nhour = 12;} else if(nhour <= 11) {ap = " AM";} else if(nhour == 12) {ap = " PM";} else if(nhour >= 13) {ap = " PM";nhour -= 12;} if(nmin <= 9) {nmin = "0" +nmin;} if(nsec <= 9) {nsec = "0" +nsec;} document.getElementById('clockbox').innerHTML=""+tday[nday]+", "+tmonth[nmonth]+" "+ndate+", "+nyear+" "+nhour+":"+nmin+":"+nsec+ap+""; setTimeout("GetClock()", 1000); } window.onload=GetClock; </script> <div id="clockbox"></div>