ios的硬件加速css3转换

Hardware accelerated css3 transitions for ios

本文关键字：转换 css3 硬件加速 ios      更新时间：2023-09-26

我不认为我的translate3d会强制硬件加速（顶部/底部定位）。我错过了什么？

.image {
        background:yellow;
        -webkit-perspective: 1000;
        -webkit-backface-visibility: hidden;
        -webkit-transition-property: -webkit-transform, top, bottom;
        -webkit-transition-duration: 0.5s;
        -webkit-transform: translate3d(0,0,0);
    }

那么，过渡的动画比您想要的要慢/更流畅？根据类名image，我猜测问题可能只是它是一个映像，即使硬件加速也会起作用；我的团队有时在iOS上进行UI模拟/演示时会遇到这种情况。您可以尝试将图像替换为大小相同的div，看看它是否移动得更平滑。

我创建了一个类，并将其添加到所有触发起伏动画的元素中。iPad2上的动画并不起伏不定，但在iPadRetina上出现了各种性能问题。

.gpu-rendered {
    -webkit-font-smoothing: antialiased;
    -webkit-backface-visibility: hidden;
    -webkit-perspective: 1000;
}
相关文章：