|
↑
Date & Time >>>
Displays the time like a real digital clock. Changes rapidly and includes hours, minutes, seconds and AM/PM indication.
Step 1: Add the below code to the <body> section of your page:
<script
language="javascript"
type="text/javascript">
var
dn;
c1
=
new
Image();
c1.src
=
"c1.gif";
c2
=
new
Image();
c2.src
=
"c2.gif";
c3
=
new
Image();
c3.src
=
"c3.gif";
c4
=
new
Image();
c4.src
=
"c4.gif";
c5
=
new
Image();
c5.src
=
"c5.gif";
c6
=
new
Image();
c6.src
=
"c6.gif";
c7
=
new
Image();
c7.src
=
"c7.gif";
c8
=
new
Image();
c8.src
=
"c8.gif";
c9
=
new
Image();
c9.src
=
"c9.gif";
c0
=
new
Image();
c0.src
=
"c0.gif";
cb
=
new
Image();
cb.src
=
"cb.gif";
cam
=
new
Image();
cam.src
=
"cam.gif";
cpm
=
new
Image();
cpm.src
=
"cpm.gif";
function
extract(h,m,s,type)
{
if
(!document.images)
return;
if
(h
<=
9)
{
document.images.a.src
=
cb.src;
document.images.b.src
=
eval("c"+h+".src");
}
else
{
document.images.a.src
=
eval("c"+Math.floor(h/10)+".src");
document.images.b.src
=
eval("c"+(h%10)+".src");
}
if
(m
<=
9)
{
document.images.d.src
=
c0.src;
document.images.e.src
=
eval("c"+m+".src");
}
else
{
document.images.d.src
=
eval("c"+Math.floor(m/10)+".src");
document.images.e.src
=
eval("c"+(m%10)+".src");
}
if
(s
<=
9)
{
document.g.src
=
c0.src;
document.images.h.src
=
eval("c"+s+".src");
}
else
{
document.images.g.src
=
eval("c"+Math.floor(s/10)+".src");
document.images.h.src
=
eval("c"+(s%10)+".src");
}
if
(dn
==
"AM")
document.j.src
=
cam.src;
else
document.images.j.src
=
cpm.src;
}
function
show3()
{
if
(!document.images)
return;
var
Digital =
new
Date();
var
hours =
Digital.getHours();
var
minutes =
Digital.getMinutes();
var
seconds =
Digital.getSeconds();
dn
=
"AM";
if
((hours
>=
12)
&&
(minutes
>=
1)
||
(hours
>=
13))
{
dn
=
"PM";
hours
=
hours-12;
}
if
(hours
==
0)
hours
=
12;
extract(hours,
minutes,
seconds,
dn);
setTimeout("show3()",
1000);
}
window.onload=show3;
</script>
<img
height=21
src="cb.gif"
width=16
name=a>
<img
height=21
src="cb.gif"
width=16
name=b>
<img
height=21
src="colon.gif"
width=9
name=c>
<img
height=21
src="cb.gif"
width=16
name=d>
<img
height=21
src="cb.gif"
width=16
name=e>
<img
height=21
src="colon.gif"
width=9
name=f>
<img
height=21
src="cb.gif"
width=16
name=g>
<img
height=21
src="cb.gif"
width=16
name=h>
<img
height=21
src="cam.gif"
width=16
name=j>
|
Step 2: The script uses 14 images as part of its interface. You can create your own, or use the 14 below:
(right click images, and select "Save Image As")
Upload them into the same directory as your webpage.
→
|
