Увеличение скорости аппаратного ускорения анимации css3 - PullRequest
Новая
       19

Увеличение скорости аппаратного ускорения анимации css3

0 голосов
/ 22 июня 2011

Я пытаюсь динамически увеличить продолжительность анимации во время анимации css3, использующей аппаратное ускорение.Используя javascript и css3 без аппаратного ускорения, я просто увеличил продолжительность анимации, и анимация ускорилась.Теперь, когда я использую translate3d вместо свойства left для анимации, увеличение продолжительности анимации не работает.У меня такое ощущение, что как только анимация выгружается в GPU, изменения в css не влияют на это.Мне нужен какой-то способ принудительного обновления анимации для графического процессора при внесении изменений.

Вот мой 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;
}

Есть какой-то известный способ сделать это, я упускаю что-то очевидное, или это просто невозможно?

Любая помощь будет очень признательна.

Спасибо

1 Ответ

2 голосов
/ 22 июня 2011

Я думаю, что это всего лишь ограничение текущих реализаций аппаратного ускорения. Как только анимация начинается, она выключается.

(Народная мудрость - считается плохой идеей давать очень большие размеры (ширина: 13000 пикселей) для блоков, которые вы хотите анимировать - это заставляет графический процессор создавать огромные объекты)

...