掘金用户头像旋转

Posted 2021-02-28 dll-ft

#pic:hover {
            transform: rotate(666turn);
            transition-delay: 1s;
            transition-property: all;
            transition-duration: 59s;
            transition-timing-function: cubic-bezier(.34,0,.84,1);
        }

transform: rotate(666turn); 1turn = 360°

transition-duration: 59s; 59秒内完成旋转666turn

transition-timing-function: cubic-bezier(.34,0,.84,1); 过渡效果的速度曲线 四个值的范围都是0-1, 代表整个过程