CSS3 3D立体感指针时钟代码

CSS3 3D立体感指针时钟代码-精品资源网
CSS3 3D立体感指针时钟代码
此内容为免费资源,请登录后查看
0
免费资源

CSS3 3D立体感指针时钟代码

一款漂亮的基于CSS3+JS实现钟表特效,界面设计带有3D立体感的CSS3指针时钟走动代码。

js代码

<script type=\"text/javascript\">
    var miao = document.getElementById(\"miao\");
    var fen = document.getElementById(\"fen\");
    var shi = document.getElementById(\"shi\");

    var clock = setInterval(function () {
        var nowDate = new Date();//每次读取当前时间
        var hour = nowDate.getHours();
        var minute = nowDate.getMinutes();
        var second = nowDate.getSeconds();

        var circleHour = hour % 12 * 30;
        shi.style.transform = \"rotate(\" + circleHour + \"deg)\";//读取到的时间为24小时制,转换为12小时
        fen.style.transform = \"rotate(\" + minute * 6 + \"deg)\";
        miao.style.transform = \"rotate(\" + second * 6 + \"deg)\";
    }, 1000);
</script>

© 版权声明
THE END
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容