css3样式?
为什么在模拟器上那个图像可以旋转,在真机上就不转了。。。
.rotation{
/* rotation表示动画效果旋转linear(始终点)12s表示执行完的时间,linear匀速 infinite无限循环 */
animation: rotation 12s linear infinite;
-moz-animation: rotation 12s linear infinite;
-webkit-animation: rotation 12s linear infinite;
-o-animation: rotation 12s linear infinite;
}
.rotation-paused{
animation-play-state: paused;
-moz-animation-play-state: paused;
-webkit-animation-play-state: paused;
-o-animation-play-state: paused;
}
[@keyframes](/user/keyframes) rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
<view class='player-info'>
<view class="player-disc {{isPlaying? 'play': ''}}">
<image class="player-img rotation {{isPlaying? '':'rotation-paused'}}" src="{{picUrl}}"/>
</view>
</view> // 其中isPlaying是判断是否旋转的标志