ho sviluppato il menu del sito web mobile: http://famosos.globo.com/ (fare clic sull'icona hamburger nella parte inferiore della pagina)ios 9 Safari Mobile ha un bug lampeggiante con trasformare scale3d e translate3d
Il suo un carosello di marchi utilizzando swiper 3.0.8, quando scorri in qualsiasi direzione su ios 9 safari le marche continuano a lampeggiare.
Ho scoperto che è perché io uso la trasformazione: scale3d (succede anche con la normale trasformazione: scala) mentre avviene la traduzione3d dello swiper.
Ho provato a usare trucchi di preserv-3d e backface-visibility, ma continua a lampeggiare quando si fa scorrere.
Ho provato a isolare il codice swiper e scala su questa codepen: http://codepen.io/guilhermebruzzi/pen/BoKovN ma per qualche motivo questo non si apre su iOS.
parti rilevanti del codice:
//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)
Qualsiasi soluzione per continuare ad usare scala e swiper su questa nuova versione di IOS? Qualcuno ha avuto un problema simile?
Grazie! :)
il codepen completo: http://codepen.io/guilhermebruzzi/full/BoKovN ora sta mostrando su iPhone e non lo fa lampeggia tutto il tempo (scorrendo da destra a sinistra lentamente i primi marchi lampeggiano). Può essere un problema di allocazione delle GPU? –
Non una risposta, ma la risposta di Diego ha aiutato a risolvere una domanda simile. http://stackoverflow.com/questions/32804106/angularjs-slide-transition-broken-on-safari-ios-9/32856283#32856283 –