js液晶电子时钟

来源：互联网发布：知乎推荐算命大师编辑：程序博客网时间：2024/05/01 07:48

效果图1：

图片15个：

========

c0.gif ~ c9.gif

cam.gif cback.gif cback2.gif colon.gif cpm.gif

clock.htm

========

<html>

<head>
<SCRIPT language="JavaScript">
<!--
var NumSrc="time/c0.gif"; //这是图片"c0.gif"的路径.
/*
以下用"replace()"(字符串替换)和"eval()"(执行字符串)函数,
令变量 c0,c1,...,c9分别是图片"c0.gif","c1.gif",...,"c9.gif"的路径,
并把对应的图象预加载入缓存.
"cam.gif","cpm.gif"和"colon.gif"不必预加载，因为它们的路径很少变化或不变:
*/

c1=new Image(); c1.src="time/c1.gif"
c2=new Image(); c2.src="time/c2.gif"
c3=new Image(); c3.src="time/c3.gif"
c4=new Image(); c4.src="time/c4.gif"
c5=new Image(); c5.src="time/c5.gif"
c6=new Image(); c6.src="time/c6.gif"
c7=new Image(); c7.src="time/c7.gif"
c8=new Image(); c8.src="time/c8.gif"
c9=new Image(); c9.src="time/c9.gif"
c0=new Image(); c0.src="time/c0.gif"

//以下写入时钟各图片,并给它们命名:
document.write('<img src='+NumSrc+' id="lch1">');
document.write('<img src='+NumSrc+' id="lch2">');
document.write('<img src='+NumSrc.replace("c0.gif","colon.gif")+'>');
document.write('<img src='+NumSrc+' id="lcm1">');
document.write('<img src='+NumSrc+' id="lcm2">');
document.write('<img src='+NumSrc.replace("c0.gif","colon.gif")+'>');
document.write('<img src='+NumSrc+' id="lcs1">');
document.write('<img src='+NumSrc+' id="lcs2">');
document.write('<img src='+NumSrc.replace("c0.gif","cam.gif")+' id="lcapm">');

//以下函数更改相应图片的路径,使图片的显示和当前时间相符:
function timerun(){

    //取得当前时间:
    now=new Date();
    myhour=now.getHours();
    myminute=now.getMinutes();
    mysecond=now.getSeconds();

    //判断是上午还是下午:
    if(myhour<12)　 lcapm.src=NumSrc.replace("c0.gif","cam.gif");
    else 　lcapm.src=NumSrc.replace("c0.gif","cpm.gif");
    if(myhour>12) 　myhour-=12;

    //改变小时数图片:
    if(myhour<10)　 lch1.src=NumSrc.replace("c0.gif","cback.gif");//当单位时,以黑屏代替
    else lch1.src=eval("c"+Math.floor(myhour/10)+".src");
    lch2.src=eval("c"+myhour%10+".src");

    //改变分钟数图片:
    lcm1.src=eval("c"+Math.floor(myminute/10)+".src");
    lcm2.src=eval("c"+myminute%10+".src");

    //改变秒钟数图片:
    lcs1.src=eval("c"+Math.floor(mysecond/10)+".src");
    lcs2.src=eval("c"+mysecond%10+".src");

//循环运行本函数:
setTimeout("timerun()",500);
}
timerun(); //触发"timerun()"函数的运行.
//-->
</script>
</head>

===============================

效果图2：

注：冒号可以闪动

图片：

dg0.gif ~ dg9.gif

dgam.gif dgpm.gif space.gif dgoff.gif dgon.gif

clockpoa.htm

------------------

    function go() {
        per = true
        start()
    }

</script>