原生js+css3圆形时钟动画特效

原生js+css3制作一款简单的圆形时钟动画特效，获取的是本地时间，代码比较精简，时钟样式可以修改图片进行美化。

分类：日期时间 > 计时器难易：初级

查看演示下载资源下载积分： 20 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

js代码

<script type="text/javascript">
			window.onload=function(){
				var hour = document.getElementById("hour");
				var min = document.getElementById("min");
				var sec = document.getElementById("sec");
				
				//开启定时器
				setInterval(function(){
					var date = new Date();
					var mills = date.getMilliseconds();
					var s = date.getSeconds()+mills/1000;
					var m = date.getMinutes()+s/60;
					var h = date.getHours() % 12+m/60;
					//console.log(s);
					//是指针旋转
					hour.style.transform = 'rotate('+h*30+'deg)';
					min.style.transform = 'rotate('+m*6+'deg)';
					sec.style.transform = 'rotate('+s*6+'deg)';
					//因ps技术原因指未能与钟盘匹配，故设置旋转中心点
					sec.style.transformOrigin = '49% 65%'
					min.style.transformOrigin = '50% 65%'
					hour.style.transformOrigin = '49% 68%'
				},10);
			}
</script>