• 0
  • 0

IOS 动画转场导致页面闪烁 解决

2020-02-18 41 0 admin 所属分类:LAYUI

在IOS的safari浏览器下做动画转场会导致z-index属性失效,哪怕设置到9999999,如果这个时候有带透明背景色会导致动画执行过程中出现闪烁 


 解决方法:

① 有大神说设置父级容器(非body)的overflow属性为hidden,经亲测,貌似没有效果.

② 设置transform的translateZ属性值,值越大,就离用户的眼睛越近

/* 以毒攻毒 */
transform: translateZ(100px);

如果有多个动画效果,每一个都最好加上该属性值,如果还是没有变化,可以继续调大属性值 


 相关文章: https://www.zhangxinxu.com/wordpress/2016/08/safari-3d-transform-z-index/

返回顶部