您的位置：首页 > 其它

使用translateZ(0)提升性能的原理是什么？

2017-07-28 00:00 232 查看
要做一个div从底部往上弹出的动画效果，代码如下

.couponList_div{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 0;
-webkit-transition: height 0.4s ease;
-moz-transition: height 0.4s ease;
-o-transition: height 0.4s ease;
transform:translateZ(0rem);
background-color: #fff;
z-index: 10;
}
.couponList_div.on{
height: 21.7rem;
transform:translateZ(21.7rem);
}

使用translateY或者使用jQuery的slideDown()或者animate()都在X5内核的微信里卡顿，唯独使用translateZ良好
原因参考https://segmentfault.com/q/1010000007962353
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航