1. 程式人生 > >css3 移動端旋轉動畫暫停

css3 移動端旋轉動畫暫停

pause transform 20px init infinite pen near border wrapper

音樂播放圖片旋轉動畫 ios不支持暫停: animation-play-state: paused;

@-webkit-keyframes rotate{
    100% {
           transform: rotate(1turn);
        }
}
.img-wrapper{
    width: 200px;    
    height: 200px;
    margin: 50px auto 0;
    overflow: hidden;
    border-radius: 100px;
}
.animation-start{
    animation: rotate 5s linear infinite
; } .suspended{ animation-play-state: paused; } .img-wrapper img{ width: 100%; border-radius: 100px; } .btn{ width: 100%; height: 30px; box-sizing: border-box; text-align: center; margin-top: 20px; line-height
: 30px; bottom: 100px; border: 1px solid #ccc; }

css3 移動端旋轉動畫暫停