我试图在使用硬件加速的 css3 动画期间动态增加动画持续时间。使用 javascript 和非硬件加速 css3,我只是增加了动画持续时间,动画会加快。现在我使用 translate3d 而不是 left 属性来制作动画,增加动画持续时间不起作用。我有一种感觉,一旦将动画卸载到 GPU,对 css 的更改就不会影响它。当我做出改变时,我需要某种方式来强制更新 GPU 的动画。
这是我的CSS。
@-webkit-keyframes gofast {
from {
-webkit-transform: translate3d(0,0,0);
}
to {
-webkit-transform: translate3d(-10240px,0,0);
}
}
.makeMeFast {
position:absolute;
top:0px;
z-index:0;
width:12288px;
-webkit-animation-name: gofast;
-webkit-animation-duration: 4s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
有没有一些已知的方法可以做到这一点,我是否遗漏了一些明显的东西,或者不能这样做?
任何帮助将不胜感激。
谢谢