CSS3+js 简易时钟

来源:互联网 发布:centos samba 配置 编辑:程序博客网 时间:2024/05/20 16:32
<div class="clock">
<div id="hour" class="common"></div>
<div id="minute" class="common"></div>
<div id="second" class="common"></div>
</div>
<script>
var hour=document.getElementById('hour');
var minute=document.getElementById('minute');
var second=document.getElementById('second');
function clock(){
var date =new Date();
var currents=date.getMilliseconds();
var s=date.getSeconds()+currents/1000;
var m=date.getMinutes()+s/60;
var h=date.getHours()%12+m/60;
//注意webkit
second.style.WebkitTransform = "rotate("+s*6+"deg)";
        minute.style.WebkitTransform = "rotate("+m*6+"deg)";
        hour.style.WebkitTransform = "rotate("+h*30+"deg)";
}
setInterval(clock,100);
</script>
原创粉丝点击