用HTML5写出来的时钟程序，只有15行,你能hold住吗

原创于 2011-10-20 11:07:09 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html5 #浏览器 #ie

杂项专栏收录该内容

12 篇文章

订阅专栏

本文介绍了一种利用HTML5和Processing.js库实现实时动态显示时间的方法。通过简单的HTML结构配合JavaScript，演示了一个能够根据当前时间更新指针位置的钟表程序。

今天看html5看见这段代码，就敲进去试了试，没想到真的跑起来，htm5太可怕了

<html>

<head>
<body>
<script src="http://files.cnblogs.com/iamzhanglei/processing.js" type="text/javascript"></script>
<script type="application/processing">
void draw() {
size(200, 200);background(0); fill(80); noStroke(); ellipse(100, 100, 160, 160); stroke(255);
line(100, 100, cos( TWO_PI*second()/60- HALF_PI) * 70 + 100, sin(TWO_PI*second()/60- HALF_PI) * 70 + 100);
      line(100, 100, cos( TWO_PI*minute()/60- HALF_PI) * 60 + 100, sin(TWO_PI*minute()/60- HALF_PI) * 60 + 100);
      line(100, 100, cos(TWO_PI*(hour()%12)/12- HALF_PI) * 50 + 100, sin(TWO_PI*(hour()%12)/12- HALF_PI) * 50 + 100);
}
</script>
<canvas>你的浏览器不支持HTML5,请使用谷歌、IE9或者火狐浏览器··</canvas>
</body>
</html>