ipad - -webkit-transform：在 iPad 上翻译块状渲染

Question

所以我知道 translate/translate3d 使用 GPU，但由于某种原因，它会导致大型图形在 iPad 上以块/块的形式呈现。使用翻译时，我很难找到任何说明图像最大宽度/高度的地方。

我希望能够在 transform 属性上使用 css 转换，但由于这个问题不能。即使是“top”属性上的 css 转换，其执行速度也比使用 jQuery.animate() 之类的东西要慢。

对此有何建议？

Answer 1

我遇到了完全相同的问题，并且使用这个小的 CSS gem 取得了很大的成功：

-webkit-backface-visibility: hidden;

我发现将它添加到正在动画的任何元素都可以解决“块状”渲染。在某些情况下，我还必须将其添加到子元素中，例如。我有一个大的包装 div 并使用 translateX 来调整 x 位置。我将 CSS 的魔法线添加到包装器 div 以及该 div 的直接子级（这是我的内容区域）。玩一玩，希望你能解决它！