问题模块 框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
客户端 微信小程序 Bug iOS IOS iPhone6p 6.6.7

纯css 做的水波纹动画 安卓机上没问题 但是用苹果手机测试 却出现闪屏效果








.wavePart {
position: relative;


}
@-webkit-keyframes opac{
from {
opacity: .5;
width:100%;
height:100%;
top:50%;
left:50%;
}
to {
opacity : 0;
width:200%;
height:200%;
top:50%;
left:50%;
}
}
.wave {
position: absolute;
top: 50%;
left: 50%;
width:100%;
height: 100%;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
background-color: var(--main-color);
border-radius: 50%;
}
.wave1 {
z-index: 2;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
.wave2,
.wave3,
.wave4 {
-webkit-animation: opac 3s infinite;
}
.wave3{
-webkit-animation-delay: 1s;
/*border-color: green;*/
}
.wave4{
-webkit-animation-delay: 2s;
/*border-color: red;*/
}
.wave1 image {
width: calc(var(--base-size)*76rpx);
height: calc(var(--base-size)*111rpx);
}

微信小程序开发问题解答