全部，
我正在开发一个专门针对 iPad 的网络应用程序，我正在使用 CSS3 过渡来为 div 设置动画(将它从左向右移动)。
我的类(class)是这样的:
.mover {
-webkit-transition:all 0.4s ease-in-out;
}
当用户点击一个按钮时，我这样做:
var s = "translate3d(" + newPosition + "px, 0, 0)";
$('.mover ').css('-webkit-transform', s);
这很好用EXCEPT用户触发转换的FIRST；第一次，有一个非常明显的闪烁。
我意识到我不需要使用 translate3d，因为我只是左右移动 div，但据我所知，这会强制 iPad 使用 GPU 加速。 (这是正确的吗？)
非常感谢!
[更新]
我对“闪烁”有点模棱两可。简而言之 - 我一直在尝试各种 CSS3 过渡(特别是在 iPad 上)，并且始终如一 - 我注意到在开始或结束时有明显的闪烁> 过渡。
换句话说，过渡本身非常平滑。但是，根据精确的设置，在过渡开始或结束之前会出现明显的闪烁。
这是另一个示例:我将三张照片 (PNG) 堆叠在一起。
底部 PNG 的不透明度 = 1.0，顶部 2 个不透明度 = 0.0。使用-webkit-keyframes，我能够在照片淡入淡出时获得丝般平滑的过渡。当动画结束时，底部照片以不透明度 = 1.0 结束，顶部两张照片以不透明度 = 0.0 结束。 (那应该是他们的最终状态)。
然而，就在动画结束的时候，下方的照片却在闪烁。就好像浏览器强制重绘/重绘屏幕，而这只需要几分之一秒。
破坏效果并渲染然后过渡无法使用就够糟糕的了。 (在我的 iMac 上，它几乎，但并非完全不可察觉。在 iPad 上，它是不容错过的)。
最佳答案
我正在处理同样的问题，我在 SO 上找到了解决方案:iPhone WebKit CSS animations cause flicker
添加就这么简单
-webkit-backface-visibility: hidden;
可能
-webkit-perspective: 1000;
到每个动画对象。它对我有用，希望这对你也有帮助
关于jquery - CSS3 transition/transform/translate3d 导致过渡的第一个或最后一个 "frame"出现严重闪烁(在 iPad 上)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5814101/