成品:
视频传不上来,,,应该是动态的。。。
在完成这个练习的过程中,学习到了:
1. setInterval(func,delay)
func : 每隔delay秒执行一次
delay : 每次延迟的毫秒数
1).在原有固定布局中,指针被固定在9点钟方向,故需 + 90
2). 获取当前秒数:(sec/60 ) * 360得到秒针转动度数
3).获取当前小时(时+分):( hour / 12) * 360 + ( minutes / 60 ) * 30
其中 : ( hour / 12) * 360 指小时数为12的多少倍(24/12小时制皆可)再乘360得到小 时所需要转的度数
( minutes / 60 ) * 30 指分钟数为60的多少倍再乘30(因为每一大格为30°)为 分钟所需要转的度数
4).获取当前分钟(分+秒):( minutes / 60 ) * 360 + ( seconds / 60 ) * 6 + 90
其中 : ( seconds / 60 ) * 6 指 1秒转6°
2.一些新的css
1). transform-origin
更改一个元素变形的原点
参数 :x,y,z
关键字:left center right top bottom
2). transform: rotate()
单位 : deg : 度数,一个圆共360度
turn :圈,一个圆共1圈,0 ~ 1 表示顺时针旋转百分比
grad : 梯度,一个圆共400梯度
rad : 弧度,一个圆共2π弧度
3). transition
transition-duration、
transition-timing-function
transition-delay
作用 : 过渡效果,多个属性之间用逗号进行分隔。
暂时这些,晚安