Javascript ios 9 mobile safari在transform scale3d和translate3d上有一个闪烁的错误

我开发了移动网站的菜单：（点击页面底部的汉堡图标）

这是一个使用Swipper 3.0.8的品牌轮盘，当你在ios 9 safari上向任何方向滑动时，品牌都会闪烁

我发现这是因为我使用transform:scale3d（也发生在normaltransform:scale中），而swiper的translate3d发生了

我尝试过使用preserve-3d和backface可见性技巧，但当你刷卡时，它仍然会闪烁

我曾尝试在这个代码笔上隔离swiper和scale代码：但由于某些原因，它在ios上无法打开

守则的有关部分：

//css
.swiper-slide-active .menu-carousel-link{
    transform: scale3d(1, 1, 1);
}

//html
<div id="carousel" class="swiper-container swiper-container-horizontal">
    <ul class="swiper-wrapper">
      <li class="swiper-slide globocom-slide">
        <a href="http://globo.com/" class="menu-carousel-link">Globo.com</a>
      </li>
      <li class="swiper-slide g1-slide">
        <a href="http://g1.globo.com/" class="menu-carousel-link">G1</a>
      </li>
      <li class="swiper-slide globoesporte-slide">
        <a href="http://globoesporte.globo.com/" class="menu-carousel-link">Globoesporte</a>
      </li>
      <li class="swiper-slide famosos-slide">
        <a href="http://famosos.globo.com/" class="menu-carousel-link">Famosos</a>
      </li>
      <li class="swiper-slide techtudo-slide">
        <a href="http://techtudo.com.br/" class="menu-carousel-link">Techtudo</a>
      </li>
      <li class="swiper-slide gshow-slide">
        <a href="http://gshow.globo.com/" class="menu-carousel-link">Gshow</a>
      </li>
    </ul>
  </div>

// coffeescript
class MenuWebCarousel
  constructor: ->
    @swiperContainer = $("#carousel")
    @swiperOptions = 
      resistanceRatio: 0
      spaceBetween: 10
      centeredSlides: true
      slidesPerView: 'auto'
  initSwiper: ->
    @swiperInstance = new Swiper(@swiperContainer[0], @swiperOptions)

//css
.滑动开关处于活动状态。菜单转盘链接{
变换：scale3d（1,1,1）；
}
//html














//咖啡脚本
类菜单旋转木马
构造函数：->
@swiperContainer=$（“旋转木马”）
@开关选项=
电阻比：0
间隔：10
中心幻灯片：正确
SlideService视图：“自动”
initSwiper:->
@swiperInstance=新的Swiper（@swiperContainer[0]，@swiperOptions）

在这个新版本的ios上，有没有解决办法继续使用scale和swiper？有人有类似的问题吗

---

谢谢！：）

这似乎是一个嵌套层组成和视口大小的错误。

---

在父层中添加

overflow:hidden

似乎可以解决这个问题。从性能的角度来看，一切似乎都是一样的（相同的布局、油漆、合成层）

我使用“定位：固定在父对象上”解决了问题

眨眼的虫子消失了

---

移动网站：（点击页面底部的汉堡图标）

iphone上现在显示的代码笔已满，并且不会一直闪烁（通过从右向左缓慢滑动，第一批品牌会闪烁）。这可能是gpu分配问题吗？不是答案，但迭戈的答案帮助解决了一个类似的问题。