JAVAscript制作钟表
本文用js制作一款简单的钟表练习
代码如下
欢迎大家交流,欢迎各位大佬指正。
HTML部分
//创建钟表
<body>
<div class="box">
<div class="clock" id="ck">
<div id="hour"></div>
<div id="min"></div>
<div id="sec"></div>
</div>
</div>
CSS 代码如下
//样式我用的是雪碧图,图片在末尾。
主要就添加图片。设置样式。还有所选图片X,Y轴距离轴心的距离。
<style>
*{
margin: 0;
padding: 0;
}
.box{
height: 500px;
width: 500px;
margin: 0 auto;
position: relative;
}
//表盘
.clock{
width: 717px;
height: 717px;
background: url("./img/bgimage.png") no-repeat center ;
background-position: -898px -800px;
zoom: 69%;
}
//时针
#hour{
position: absolute;
top: 510px;