我有一些我正在制作动画的文字,我使用CSS关键帧.我保留了动画最终结果的外观,所以我使用动画填充模式:转发这样做,如下所示:
#my-text {
opacity: 0;
}
.show-me {
animation-name: show-me;
animation-duration: 2s;
animation-fill-mode: forwards
}
@keyframes show-me {
100% {
opacity: 1;
}
}
然后我使用jQuery将show-me类添加到元素:
$('#my-text').addClass('show-me');
稍后,在动画完成后,我尝试通过代码更改元素的不透明度,但无法执行此操作:
// this won't change the opacity,unfortunately
$('#my-text').css('opacity',0);
这是一个显示问题的示例:http://jsfiddle.net/x3mbkbwL/2/
使用填充模式转发时,如何覆盖动画中的值集?我知道当我需要更改元素的不透明度时,我可以删除该类(在本例中为“show-me”),但似乎我应该能够直接覆盖JavaScript中的css并且它将覆盖不透明度.
最佳答案