下面是开启GPU加速和防止闪烁的方法

开启GPU加速
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);

防止闪烁
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;

-webkit-perspective: 1000;
-moz-perspective: 1000;
-ms-perspective: 1000;
perspective: 1000;

CSS动画不同的设置性能会有所不同,我可以举个例子:
位移动画,你用from{坐标} to {坐标} 和translateXY 的效率就很不一样,
前者在手机上卡的不行,后者非常流畅

标签:无

你的评论