Vectorials
Flash Perfection
3D Lessons
Tutorialkit
Markup Tutorials
Learn PHP
network
adv banner
Binary Clock
by Mark Pearson
12/24 Hour Clock
by Ian Lates
Date Time Clock
by Mark Pearson
Simple Digital Clock
by Craig Lowe
Web Development Tutorials
Rich collection of PHP and MySQL tutorials as well as tutorials on different content management systems.
HTML and CSS tutorials
A collection of free web templates. Premium quality web designs, easy to browse.
Web Programming  Home Web Programming JavaScript Javascript Clock
rss

Javascript Clock

Author: Spacetech More by this author

Added: Feb 23, 2007 Rating:  Average Rating: 2.58 Votes: 60 Position: 10670 of 12268Average Rating: 2.58 Votes: 60 Position: 10670 of 12268Average Rating: 2.58 Votes: 60 Position: 10670 of 12268Average Rating: 2.58 Votes: 60 Position: 10670 of 12268Average Rating: 2.58 Votes: 60 Position: 10670 of 12268 Level: All levels Software:  DreamweaverGoLiveFrontPage

Javascript ClockThis will create a nice JS clock. You can change the color of it too.

1. Insert this into the of an HTML document"

<script type="text/javascript">
function showtime(){
if (!document.all& &!document.getElementById)
return
thelement=document.getElementById? document.getElementById("tick2"): document.all.tick2
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
var dn="PM"
if (hours<12)
dn="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 ctime=hours+":"+minutes+":"+seconds+" "+dn
thelement.innerHTML="<b style='font-size:14;color:blue;'>"+ctime+"</b>"
setTimeout("showtime()",1000)
}
window.onload=showtime
</script>

2. Insert this into the :

<span id=tick2></span>

3. To change the clock color look at

thelement.innerHTML="<b style='font-size:14;color:blue;'>"+ctime+"</b>"

You can change "color:blue;" to something like "color:red;" or "color:black;" etc..

Enjoy!



Author's URL: www.dannyscripts.com

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Web Programming  More Web Programming: Most Popular Materials | Fresh Materials | More JavaScript Tutorials at LearnPHP.org
Add comments to "Javascript Clock"