我正在使用CSS3动画,我希望能够移动到动画中的特定位置.例如,如果CSS看起来像这样(并假装我使用了所有正确的前缀):
@keyframes fade_in_out_anim {
0% { opacity: 0; }
25% { opacity: 1; }
75% { opacity: 1; }
100% { opacity: 0; }
}
#fade_in_out {
animation: fade_in_out_anim 5s;
}
Run Code Online (Sandbox Code Playgroud)
然后我希望能够停止动画,并将其移动到50%标记.我想理想的JavaScript看起来像这样:
var style = document.getElementById('fade_in_out').style;
style.animationPlayState = 'paused';
// Here comes the made up part...
style.animation.moveTo('50%'); // Or alternately...
style.animationPlayPosition = '50%';
Run Code Online (Sandbox Code Playgroud)
有谁知道实现这一目标的方法(希望在Webkit中)?