0

我试图在使用硬件加速的 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;
}

有没有一些已知的方法可以做到这一点,我是否遗漏了一些明显的东西,或者不能这样做?

任何帮助将不胜感激。

谢谢

4

1 回答 1

2

我认为这只是当前硬件加速实现的一个限制。一旦动画开始,它就会消失。

(民间智慧——据说给你想要动画的块提供非常大的尺寸(又名宽度:13000px)是一个坏主意——它会使 GPU 创建巨大的对象)

于 2011-06-22T17:46:44.487 回答