[BUG]:
在用大型的圆角矩形制作水波特效的时候发现，在安卓设备上显示正常，在iOS11的设备上显示也是正常，在iOS10设备上显示为，超出屏幕部分的圆角矩形未渲染，导致角度旋转动画进行时会有一段时间为空白，甚至是在缺失一个view组件。然后无意间发现，home键返回主页再返回微信小程序时样式又显示正常，锁屏再显示也是正常。
[DEMO]




.water-wave-container{
position: absolute;
top: 0;
left: 0;
height: 20rem;
width: inherit;
box-sizing: border-box;
z-index: 0;
}
.water1{
height: 60rem;
width: 65rem;
border-radius: 45rem;
background-color: #4099ec;
z-index: 1;
position: absolute;
top: -48rem;
left: -32.5rem;
margin-left: 50%;
animation: rolling infinite 7s linear;
-webkit-animation: rolling infinite 7s linear;
}
.water2{
height: 100rem;
width: 100rem;
border-radius: 40rem;
background-color: #9bcbf7;
z-index: 0;
position: absolute;
top: -90rem;
left: -50rem;
margin-left: 50%;
animation: rolling infinite 10s linear;
-webkit-animation: rolling infinite 10s linear;
}

@keyframes rolling{
from{
transform: rotate(0);
-webkit-transform: rotate(0);
}
to{
transform: rotate(360deg);
-webkit-transform: rotate(360deg);
}
}

问了问题，官方根本不看？认证付款提示腾讯公司的账户不对死活付款不过去 ...。什么意思啊？这种渲染问题都不解决，难道制作一个水波纹都要弄雪碧图来做动画吗？？？？？？？？？？？？

微信小程序开发问题解答 本文来自微信小程序工厂 http://www.xcxgc.com，转载请保留。

本文网址：http://www.91bianli.com/weixinxiaochengxu/31934.html