相信大家都会喜欢以下效果演示中的液晶时钟，这可是用JavaScript语言和图片做出来的哦！下面让我们一起来制作吧。

制作步骤：

　　1) 首先准备好13幅液晶数字的图片，它们的显示效果和名称如下表所示，你可以点击这里下载它们，并把它们放到"lcnumber"文件夹中：

(c0.gif)	(c1.gif)	(c2.gif)	(c3.gif)	(c4.gif)
(c5.gif)	(c6.gif)	(c7.gif)	(c8.gif)	(c9.gif)
(cam.gif)	(cpm.gif)	(colon.gif)

　　2) 现在我们开始编写JavaScript代码：

<SCRIPT language="JavaScript">
<!--
  var NumSrc="lcnumber/c0.gif"; //这是图片"c0.gif"的路径.
  /*
  以下用"replace()"(字符串替换)和"eval()"(执行字符串)函数,
  令变量 c0,c1,...,c9分别是图片"c0.gif","c1.gif",...,"c9.gif"的路径,
  并把对应的图象预加载入缓存.
  "cam.gif","cpm.gif"和"colon.gif"不必预加载，因为它们的路径很少变化或不变:
  */
  for(i=0;i<=9;i++){
    eval("var c"+i+"=new Image();c"+i+".src=NumSrc.replace('c0.gif','c'+i+'.gif');");
  }
  //以下写入时钟各图片,并给它们命名:
  document.write('<table border="0" cellspacing="0" bgcolor=black height=1><tr>');
  document.write('<td><img src='+NumSrc+' id="lch1"></td>');
  document.write('<td><img src='+NumSrc+' id="lch2"></td>');
  document.write('<td><img src='+NumSrc.replace("c0.gif","colon.gif")+'></td>');
  document.write('<td><img src='+NumSrc+' id="lcm1"></td>');
  document.write('<td><img src='+NumSrc+' id="lcm2"></td>');
  document.write('<td><img src='+NumSrc.replace("c0.gif","colon.gif")+'></td>');
  document.write('<td><img src='+NumSrc+' id="lcs1"></td>');
  document.write('<td><img src='+NumSrc+' id="lcs2"></td>');
  document.write('<td><img src='+NumSrc.replace("c0.gif","cam.gif")+' id="lcapm"></td>');
  document.write('</tr></table>');

  //以下函数更改相应图片的路径,使图片的显示和当前时间相符:
  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;

    //改变小时数图片:
    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>

　　现在运行一下看看，效果还挺满意吧。