CSS动画仅在iPad上崩溃Safari

Question

我的网站在iPad和iPad上的Safari中崩溃。我正在使用css3动画在标题中制作一张大图片（4800 x 374像素，但只有336 kb）。大约十秒钟后，这会导致Safari崩溃。

您可以在http://bakabaka.nl/preview/leuk/

看到该网站

我可以防止此次崩溃，如果是这样，怎么办？我可以让动画更顺畅吗？现在它非常锯齿......

Answer 1

这是一个黑暗中的镜头，但也许值得。

我会尝试在iOS上使用3D动画，因为它使用硬件加速：

-webkit-transform: translate3d(X,Y,Z);

有关详细信息，请参阅此处：'3D Transform Functions'

iOS上也会出现一些非常大的图像问题。也许将它们切成碎片是更好的解决方案。阅读更多相关信息：“Know iOS Resource Limits”

Answer 2

我也经历过类似的事情。对于其他可能正撞墙的人来说，这会在桌面和iOS上崩溃Safari。 真的并不喜欢那个::window-inactive选择器。

::-webkit-scrollbar-thumb:window-inactive {
     background: #f2f2f2; 
}