iPhone 4上的HTML5过渡性能

Question

这里已经提出了相关的问题：CSS3 or jQuery animation with given step

现在我想问，有没有一种可以在iPhone 4/ iPad / iPad 2上工作的转换(CSS3或jQuery)，让我们逐渐改变全屏幻灯片(图像甚至帧，充满控件)，并且足够快，以保证流畅？

致以敬意，

Answer 1

为了在iOS设备上获得最高性能，请在过渡/动画中使用translateZ(0)或translate3d(0,0,0)，以通过GPU启用硬件加速。

更多信息请点击此处：http://www.html5rocks.com/en/tutorials/speed/html5/#toc-visual-fidelity

您将如何实现此功能的示例：

CSS

.fadeOut{ -webkit-animation: fadeout 750ms; }
@-webkit-keyframes fadeout {
    0% { -webkit-transform: translateZ(0);
        opacity:1;
    }
    100% { -webkit-transform: translateZ(0);
        opacity:0;
    }       
}

.fadeIn{ -webkit-animation: fadein 750ms; }
@-webkit-keyframes fadein {
    0% { -webkit-transform: translateZ(0);
        opacity:0;
    }
    100% { -webkit-transform: translateZ(0);
        opacity:1;
    }       
}