之前学习了下html5中的canvas元素，为了练练手就实现了一个简易的时钟。时钟本身并不复杂，也没有使用图片进行美化，不过麻雀虽小五脏俱全，下面就与大家分享一下： 实现效果： html代码： JS代码 ...

老师上课需要我们做一个时钟的小作业 ，我把它放在上面记录一下啦 表盘和时针我都是用的背景图的形式，然后绝对定位，通过调整left和top确定时针、分针、秒针的位置，transform-origin设置它们的旋转中心 具体效果： HTML代码： css代码： JS代码（设置一个定时器 ...

这里随便附的几张图，代码中用到的也可以自行调换哦~ clock.jpg hour.png minute.png second.png ...

（效果图） 分两步进行的。 第一步： 要得到现在的 时 分 秒 但是这里面有一个小玄机 。 比如现在是 9点整 时针指向 9 是没错的 但是如果现在是 9点半 时针应该指向的是 9到10 之间 才对 所以，我们不但要得到现在的小时 ，还要得到 已经 ...

又来一个时钟效果了，这个的实现不需要canvas，都是div、ul、li画出的，好玩有真实。 哈哈~ 需要的js才能实现到走动这个效果，但js的内容不多，也不难。 主要是一个css里transform的使用的思路，transform里有很多变幻属性，而普通的时钟 在我心中就是个圆圆的东西 ...

今天我看到百度搜索的时间那个效果不错，于是就产生了模仿一下的效果，不过为了节省时间，就随便布了下局，废话不多说，先看看效果吧，顺便把百度的效果也拿过来。 对比样子差了好多啊，但是基本功能都是实现了的，只要修改样式就好了，我的美感特别差，所以就…… 我用的是css3和js实现的这个效果，渐变 ...

　　实现原理：通过js获取到系统时间，然后分别算出年，月，日，时，分，秒，然后拼接年月日，时分秒，然后通过定时器setInterval每过一秒去获取这些数据，这样就可以实现时钟的效果 效果图 ...

　　设计思路： 　　数码时钟即通过图片数字来显示当前时间，需要显示的图片的URL根据时间变化而变化。 　　a、获取当前时间Date()并将当前时间信息转换为一个6位的字符串; 　　b、根据时间字符串每个位置对应的数字来更改图片的src的值，从而实现更换显示图片; 　　构建HTML基础 ...