1

そのため、iOS用のWebアプリでpngを無限に回転させようとしていますが、シミュレーターで動作させるのに苦労しています。ここに私のCSS：

 #spinner { -webkit-animation: spinner 1s infinite linear; }

@-webkit-keyframes spinner {
    0% { -webkit-transform: rotate3d(0,0,1,0deg); }
    100% { -webkit-transform: rotate3d(0,0,1,360deg); }
}

それは最新のChromeで完全に動作します..しかし、モバイルサファリは0-360が好きではないようです. 0 から 180 まで試してみましたが、奇妙な理由でうまくいきました...どうすれば 360 度すべてに移動できますか?

ありがとう！

4

1 に答える 1

5

YuriAlbuquerqueが言ったように、あなたはこのようにすることができます

@-webkit-keyframes spinner {
    0% { -webkit-transform: rotate3d(0,0,1,0deg); }
    25% { -webkit-transform: rotate3d(0,0,1,90deg); }
    50% { -webkit-transform: rotate3d(0,0,1,180deg); }
    75% { -webkit-transform: rotate3d(0,0,1,270deg); }
    100% { -webkit-transform: rotate3d(0,0,1,360deg); }
}

キーフレームの 25% と 75% を削除することも機能しますが、ios6 未満でのみ機能します。iOS6では、25%と75%を加算しないと時計回りに180度、反時計回りに180度から360度回転します。

于 2012-09-07T06:50:07.700 に答える