ios transition translate 闪屏问题 ()

问题描述:

如图:黄色框区域做了的是背景图;红色框里的箭头做了一动画(忽上忽下),每次进入页面,背景空白,只显示显示小箭头,手划一下才会出现背景;

解决方案:

给背景加以下css:

 -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);

  

小箭头动画代码:

.movedown{
    -webkit-animation: movedown 1s infinite ease-in-out;
    animation: movedown 1s infinite ease-in-out; 
}
@-webkit-keyframes movedown{
    0%{-webkit-transform: translate3d(0,0,0);opacity: 1}
    50%{-webkit-transform:translate3d(0,10px,0);opacity: 0.5}
    100%{-webkit-transform:translate3d(0,0px,0);opacity: 1}
}
@keyframes movedown{
    0%{transform: translate3d(0,0,0);opacity: 1}
    50%{transform:translate3d(0,10px,0);opacity: 0.5}
    100%{transform:translate3d(0,0px,0);opacity: 1}
}

  参考链接:http://www.cnblogs.com/gaoxue/p/3753734.html 

原文地址:https://www.cnblogs.com/tangbuluo/p/7839131.html