Date & Time Effects >>> Basic Clock

Basic Clock

This clock continuously updates without the use of a text box. Easily position anywhere on your site.

Add the below code to the <body> section of your page:


		<center>

		<!-- Adjust the placement of the 
		clock in the line below -->

		<span
		id="pendule"></span>

		<script
		language="javascript"
		type="text/javascript">

		/* Visit http://www.yaldex.com/ 
		for full source code

		and get more free JavaScript, CSS and DHTML scripts! */

		<!-- Begin

		function 
		clock()
		{

		var 
		digital =
		new
		Date();

		var 
		hours = 
		digital.getHours();

		var 
		minutes = 
		digital.getMinutes();

		var 
		seconds = 
		digital.getSeconds();

		var 
		amOrPm =
		"AM";

		if
		(hours
		>
		11) 
		amOrPm =
		"PM";

		if
		(hours
		>
		12) 
		hours = 
		hours -
		12;

		if
		(hours
		==
		0) 
		hours =
		12;

		if
		(minutes
		<=
		9) 
		minutes =
		"0"
		+ 
		minutes;

		if
		(seconds
		<=
		9) 
		seconds =
		"0"
		+ 
		seconds;

		dispTime 
		=
		'<b>'+hours
		+
		":"
		+ 
		minutes +
		":"
		+ 
		seconds +
		" "
		+ 
		amOrPm+'</b>';

		document.getElementById('pendule').innerHTML
		= 
		dispTime;

		setTimeout("clock()",
		1000);

		}

		window.onload=clock;

		//  End -->

		</script>

		</center>

Get Advanced
JavaScript and Ajax Editor,
Validator and Debugger!
1st JavaScript Editor.

Code was highlighted by 1st JavaScript Editor (The Best JavaScript Editor!).