我在 jsfiddle 做了一个示例页面

如果我在 sway 元素上启用 #dog 动画并滚动页面,我会在 SVG 上看到大量 strip 。

如果我关闭动画(删除 -webkit-animation-name 位), strip 就会消失,SVG 看起来应该(平滑)

有谁知道是什么导致了这个问题?有什么办法可以解决它?

我只在 Webkit 浏览器中尝试过(Chrome、Canary,都在 OSX 上)

最佳答案

似乎动画触发了渲染梯度很差的 GPU,可以通过简单地在 translate3d(0,0,0) 上应用 #test 来重现该错误。 http://jsfiddle.net/LKmbN/

除了 turning off GPU acceleration,我能想到的唯一解决方法是通过 javascript 制作动画。希望有人能想出一些不那么痛苦的东西。

关于css - Webkit 动画打破了它下面的 SVG,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/13491901/

10-11 23:24
查看更多