WilRose HTML Tutorial, Learn HTML on line for free! JavaScript Clock

JavaScript Clock

This site designed with Coffee Cup HTML Editor ++ ver. 6.2

HTML Tutorial

JavaScript Examples

Rollovers

MouseDown

JS Clock

CountDown

Status Window

Status Window 2

Random Image

JS Cookies

Background Changer

Scrolling Banner

Members Area

Special Effects using JavaScript
Do you know what time it is?

This is a simple clock that gets the system time from your web page visitor's system (provided that their clock is set right), and displays it in a text input form wherever you put it on the page. It is a 3 part script.
The first part of the script resides between the <HEAD> and the </HEAD> tags and it defines the function, determines how to display it, and gets the clock.
The second part of the script is within the first <BODY> tag and starts the clock as soon as the page is loaded into your visitor's Browser.
The third part of the script is the actual <FORM> that displays the clock on the web page. You can put this form wherever your heart desires.
Here's how it's done:

<HTML>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

var timerID = null;
var timerRunning = false;

function stopclock ()
{
  if(timerRunning)
  clearTimeout(timerID);
  timerRunning = false;
}

function showtime () 
{
  var now = new Date();
  var hours = now.getHours();
  var minutes = now.getMinutes();
  var seconds = now.getSeconds()

var timeValue = "" + ((hours >12) ? hours -12 :hours)
  timeValue += ((minutes < 10) ? ":0" : ":") + minutes
  timeValue += ((seconds < 10) ? ":0" : ":") + seconds
  timeValue += (hours >= 12) ? " P.M." : " A.M."
  document.clock.face.value = timeValue;

// you could replace the above with this
// and have a clock on the status bar:
// window.status = timeValue;

timerID = setTimeout("showtime()",1000);
  timerRunning = true;
}

function startclock () 
{
// Make sure the clock is stopped
  stopclock();
  showtime();
}

</SCRIPT>

</HEAD>

<TITLE>JavaScript Clock</TITLE>

<BODY onLoad="startclock(); timerONE=window.setTimeout" BGCOLOR="FFFFFF" TEXT="000000"><script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-47423994-1', 'fortunecity.ws');
  ga('send', 'pageview');

</script>
<center>
<br>
	
	<div>	
<script language="javascript" type="text/javascript" src="http://ad.broadcaststation.net/ads/show_ad.php?width=728&height=90"></script>
	</div>
</center>

</BODY>

<center>

</center>
</HTML>

Recommended Books

Top of Page?