问题描述:
如图:黄色框区域做了的是背景图;红色框里的箭头做了一动画(忽上忽下),每次进入页面,背景空白,只显示显示小箭头,手划一下才会出现背景;
解决方案:
给背景加以下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