我正在尝试为旋转元素设置动画,这在Android上非常有用,但在iOS上它会在90度旋转时卡住。
我想用CSS做动画来保持javascript代码的清洁。此外,javascript动画可以阻止我想要运行的其他JavaScript代码。
@keyframes rotate-element {
0% {transform: rotate(0);}
25% {transform: rotate(90);}
50% {transform: rotate(180);}
75% {transform: rotate(270);}
100%{transform: rotate(360);}
}
#clock {
animation-name: rotate-element;
animation-duration: 10s;
animation-iteration-count: infinite;
}
我的页面看起来像这样
<Page xmlns="http://schemas.nativescript.org/tns.xsd" loaded="pageLoaded" actionBarHidden="true" backgroundSpanUnderStatusBar="true" id="main">
<StackLayout>
<Image id="clock" src="~/Images/clock.png"></Image>
</StackLayout>
</Page>