文章/答案/技术大牛

发布

社区首页 >问答首页 >提高硬件加速css3动画的速度

问提高硬件加速css3动画的速度
EN

Stack Overflow用户

提问于 2011-06-22 22:49:45

回答 1查看 1.9K关注 0票数 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;
}

有没有一些已知的方法可以做到这一点，我是不是遗漏了什么明显的东西，或者只是不能做到？

任何帮助都将不胜感激。

谢谢

hardware-acceleration

javascript

animation

css

回答 1

Stack Overflow用户

回答已采纳

发布于 2011-06-23 01:46:44

我认为这只是当前硬件加速实现的一个限制。一旦动画开始，它就会停止播放。

(民间智慧-据说给你想要动画的块赋予非常大的尺寸(也就是宽度: 13000px)是一个坏主意-它会让GPU创建巨大的对象)

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/6441889

复制

相似问题

问提高硬件加速css3动画的速度
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问提高硬件加速css3动画的速度EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问提高硬件加速css3动画的速度
EN