收藏
回答

IOS出现css动画闪烁

问题模块 框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
客户端 小程序 Bug iOS 12.2 iPhone 6 7.0.3



使用css3动画时,在IOS真机上出现闪烁。

目前发现闪烁是有前提因素的,就是css动画的View是使用“position: absolute;”并超出视觉区域的就会出现闪烁。


.box{
    width: 100%;
    height: 600rpx;

    overflow: hidden;

   position: relative;

}
 
.animation,.animationB{
    width: 550rpx;
    height: 550rpx;
    position: absolute;
    right:-200rpx;
    top:-200rpx;

    border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;

   background:#000;

   animation: rotate 2s infinite forwards linear;

}

.animationB{

   animation: rotate-opposite 3s infinite forwards linear;

}


@keyframes rotate {

  100% {

    transform: rotate(360deg);

  }

}


@keyframes rotate-opposite {

  100% {

    transform: rotate(-360deg);

  }

}

<view class="box">
<view class="animation"></view>
<view class="animationB"></view>
</view>



最后一次编辑于  03-21  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

2 个回答

  • 樹袋大熊
    樹袋大熊
    05-19

    你好,遇到了相同的问题。

    请问您是如何解决的呢?


    另外,这行代码并不管用

    -webkit-backface-visibility: hidden;
    05-19
    赞同 2
    回复
  • 娇华
    娇华
    03-21

    请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    03-21
    赞同
    回复 5
    • KEVEN
      KEVEN
      03-21

      https://developers.weixin.qq.com/s/IPgtz2m67F7k

      03-21
      回复
    • KEVEN
      KEVEN
      03-22

      请问复现了吗?

      03-22
      回复
    • 娇华
      娇华
      03-22回复KEVEN

      我们看下,有进展同步

      03-22
      回复
    • 雷恩-塞拉斯
      雷恩-塞拉斯
      07-22
      问题解决了吗??
      07-22
      回复
    • 娇华
      娇华
      07-22回复雷恩-塞拉斯
      微信版本更新至最新的7.0.5看看,还有问题麻烦单独发帖反馈下
      07-22
      回复