Javascript 旋转css3动画后保留最终位置
有没有办法使这个CSS3JavaScript动画平滑和精细请查看链接 下面给出了我使用的css动画Javascript 旋转css3动画后保留最终位置,javascript,css,Javascript,Css,有没有办法使这个CSS3JavaScript动画平滑和精细请查看链接 下面给出了我使用的css动画 .pageanim { /* Safari and Chrome */ -webkit-animation:nextpage 1s; -webkit-animation-timing-function:linear; -webkit-transform-origin: left; -webkit-transform-style: preserve-3d;
.pageanim
{
/* Safari and Chrome */
-webkit-animation:nextpage 1s;
-webkit-animation-timing-function:linear;
-webkit-transform-origin: left;
-webkit-transform-style: preserve-3d;
}
.hideface
{
backface-visibility:hidden;
-webkit-backface-visibility:hidden;
}
@-webkit-keyframes nextpage /*Safari and Chrome*/
{
from {-webkit-transform:rotatey(0deg); }
to {-webkit-transform:rotatey(-180deg);
}
}
.revpageanim
{
/* Safari and Chrome */
-webkit-animation:prepage 1s;
-webkit-animation-timing-function:linear;
-webkit-transform-origin: 100% 0% 0px;
}
@-webkit-keyframes prepage
{
from {-webkit-transform:rotatey(0deg);}
to {-webkit-transform:rotatey(90deg);}
}
通过添加“动画填充模式”属性,可以选择应保留在动画末尾的是动画的第一帧还是最后一帧:
animation-fill-mode: forwards;
请看java脚本,动画结束后,我将向左移动到0%。这就是它停止的地方。