- 当前 Bug 的表现(可附上截图)
使用css和wx.createAnimation 设置旋转动画在苹果手机上会出现一半显示一半不显示的情况
旋转中
旋转完成后正常
- 预期表现
- 复现路径
- 提供一个最简复现 Demo
.enterAndOrder {
width: 265rpx;
animation: myfirst 3s linear 0s infinite normal;
/* Firefox: */
-moz-animation: myfirst 3s linear 0s infinite normal;
/* Safari 和 Chrome: */
-webkit-animation: myfirst 3s linear 0s infinite normal;
/* Opera: */
-o-animation: myfirst 3s linear 0s infinite normal;
}
@keyframes myfirst {
0% {
transform:rotatey(-90deg);
}
25% {
transform:rotatey(0deg);
}
30% {
transform:rotatey(20deg);
}
35% {
transform:rotatey(0deg);
}
95% {
opacity: 1;
}
100% {
opacity: 0;
}
}
wechatide://minicode/D9BtCqmV7z2u
你好,请提供一下出现问题的机型和微信版本,以及能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。
wechatide://minicode/D9BtCqmV7z2u
我这边在ios、Android测试是正常的,请问具体的机型、微信版本是什么呢?
感谢回复,已经解决了。
rotateY 的时候,需要同时 translateZ 才行
你好,请问可以详细说下嘛,translateZ值怎么设置
.fliping {
transform: translateX(-1px) translateZ(1000px) rotateY(180deg);
}
比较简单粗暴的设置例子