解决移动端动画卡顿问题

1、开启translateZ或 translate3d
webkit-transform: translateZ(0); 
-moz-transform: translateZ(0); 
-ms-transform: translateZ(0); 
-o-transform: translateZ(0); 
transform: translateZ(0);

webkit-transform: translate3d(0,0,0); 
-moz-transform: translate3d(0,0,0); 
-ms-transform: translate3d(0,0,0); 
-o-transform: translate3d(0,0,0); 
transform: translate3d(0,0,0);

2、backface-visibility
-webkit-backface-visibility: hidden;
backface-visibility: hidden;

3、perspective
-webkit-perspective:1000;
perspective:1000

4、运动元素的父级transform-style
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;


发布了56 篇原创文章 · 获赞 8 · 访问量 7万+
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览