CSS：是transition：left / top GPU加速？ [英] CSS: is transition: left/top GPU accelerated?

问题描述

我知道你可以强制GPU加速，通过应用一个过渡到transform属性来实现屏幕上元素的平滑动画，例如：

I know that you can force GPU acceleration to achieve smooth animation of elements across the screen by applying a transition to the 'transform' property, e.g.:

elem.style.transition = 'all 3s ease-out';
elem.style.transform = 'translateX(600px)';

但我想知道如果你替换第二行会发生什么：

But I was wondering what would happen if you replaced the second line with:

elem.style.left = '600px'; 

GPU加速度会为左（或上）属性它必须是在transform属性？在我看来，它应该是GPU加速，但我不能从任何我读过的文档收集最后的答案。

Would/could GPU acceleration kick in for the "left" (or "top") property, or does it have to be on the transform property? It seems to me that it should be GPU accelerate-able, but I can't glean a final answer from any of the documentation I've read.

推荐答案

不加速。您必须使用特定的CSS3属性才能加速。我想您会发现这些链接很有趣：

It's not accelerated. You have to use the specific CSS3 properties for it to be accelerateable. I think you'll find these links interesting:

http://www.html5rocks.com/en/tutorials/speed/html5/

http://www.chromium.org/developers/design-documents/gpu-accelerated-compositing -in-chrome

是否使用javascript排除硬件加速度来动画CSS3变换的值？

这篇关于CSS：是transition：left / top GPU加速？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！