Live Graphic Clock And Date - JavaScript Made Easy: Free JavaScripts Tutorials Example Code

Metachecker.net

|

TrafficChecker.net

|

RankChecker.net

Learn Java Script Today

|

Over 5000 Free Fonts

|

|

Javascript Forum

|

Other Javascript Resources

|

JavaScript Basics

Inserting Javascript

Complete Tutorial

Advance DHTML Tutorial


Live Graphic Clock And Date

Here is a date and time script that uses graphics and updates itself. Also download the images...digits1.rar


Insert into <HEAD>
<script language="JavaScript"> <!-- Hide from old browsers var timerID = null var timerRunning = false function stopclock (){ if(timerRunning){ clearTimeout(timerID); timerRunning = false } } function showtime () { var now = new Date(); year = new String(now.getYear()); month = new String(now.getMonth() + 1); date = new String(now.getDate()); hours = new String(now.getHours()); minutes = new String(now.getMinutes()); seconds = new String(now.getSeconds()); document.ampm.src = (hours < 12) ? "dgam.gif" : "dgpm.gif"; hours = (hours > 12) ? (hours - 12) + "" : hours + "" hours = (hours == "0") ? "12" : hours document.day1.src = (date < 10) ? "dg0.gif" : "dg" + date.charAt(0) + ".gif"; document.day2.src = (date < 10) ? "dg" + date + ".gif" : "dg" + date.charAt(1) + ".gif"; document.month1.src = (month < 10) ? "space.gif" : "dg" + month.charAt(0) + ".gif"; document.month2.src = (month < 10) ? "dg" + month + ".gif" : "dg" + month.charAt(1) + ".gif"; document.year1.src = (year < 10) ? "dg0.gif" : "dg" + year.charAt(0) + ".gif"; document.year2.src = (year < 10) ? "dg" + year + ".gif" : "dg" + year.charAt(1) + ".gif"; document.hour1.src = (hours < 10) ? "space.gif" : "dg" + hours.charAt(0) + ".gif"; document.hour2.src = (hours < 10) ? "dg" + hours + ".gif" : "dg" + hours.charAt(1) + ".gif"; document.colon.src = (seconds % 2) ? "dgon.gif" : "dgoff.gif"; document.minute1.src = (minutes < 10) ? "dg0.gif" : "dg" + minutes.charAt(0) + ".gif"; document.minute2.src = (minutes < 10) ? "dg" + minutes + ".gif" : "dg" + minutes.charAt(1) + ".gif"; timerID = setTimeout("showtime()",1000); timerRunning = true } function startclock () { stopclock(); showtime() } // --> </SCRIPT>

Insert into <BODY>
<body onLoad="startclock();"> <img src="space.gif" height=21 width=16 name="month1"><img src="space.gif" height=21 width=16 name="month2"><img src="dg-.gif" height=21 width=16><img src="space.gif" height=21 width=16 name="day1"><img src="space.gif" height=21 width=16 name="day2"><img src="dg-.gif" height=21 width=16><img src="space.gif" height=21 width=16 name="year1"><img src="space.gif" height=21 width=16 name="year2"> <img src="space.gif" height=21 width=16> <img src="space.gif" height=21 width=16 name="hour1"><img src="space.gif" height=21 width=16 name="hour2"><img src="dgc.gif" height=21 width=10 name="colon"><img src="space.gif" height=21 width=16 name="minute1"><img src="space.gif" height=21 width=16 name="minute2"><img src="space.gif" height=21 width=16 name="ampm">

Other Options