html+css+js完成环形倒计时






倒计时
























布局思路:用clip属性把大圆分成俩半,并绝对定位覆盖在上面,小圆放文字显示时间动态,并覆盖在hold上。

逻辑思路:前30秒使右边的半圆旋转,30秒时右边的圆旋转了180deg,左边的直接也旋转180deg,然后接下30秒使左边的半圆从180deg开始旋转,每分钟重置。

备注:代码可以直接复制看效果

你可能感兴趣的:(html+css+js完成环形倒计时)