相关疑难解决方法(0)

我开发了移动网站的菜单:http://famosos.globo.com/(点击页面底部的汉堡图标)

它是使用swiper 3.0.8的品牌旋转木马,当你在ios 9 safari上向任何方向滑动时,品牌会一直闪烁.

我发现这是因为我使用了transform:scale3d(也发生在正常变换:scale),而swiper的translate3d发生了.

我尝试过使用保存-3d和背面可视性技巧,但是当你滑动时它仍然会闪烁.

我试图在这个codepen上隔离swiper和scale代码:http://codepen.io/guilhermebruzzi/pen/BoKovN 但由于某种原因,这不会在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: …