tôi đã phát triển thực đơn của các trang web di động: http://famosos.globo.com/ (nhấp vào biểu tượng bánh burger trên dưới cùng của trang)ios 9 săn điện thoại di động có một lỗi nhấp nháy với transform scale3d và translate3d
của một băng chuyền của các thương hiệu sử dụng swiper 3.0.8, khi bạn vuốt sang bất kỳ hướng nào trên ios 9 safari các thương hiệu tiếp tục nhấp nháy.
Tôi phát hiện ra rằng đó là vì tôi sử dụng biến đổi: scale3d (cũng xảy ra với biến đổi bình thường: scale) trong khi dịch3d của trình quét xuất hiện.
Tôi đã thử sử dụng các thủ thuật hiển thị quảng cáo bảo vệ-3d và mặt sau, nhưng nó vẫn tiếp tục nhấp nháy khi bạn vuốt.
Tôi đã cố gắng cách ly mã vạch và mã vạch trên mã này: http://codepen.io/guilhermebruzzi/pen/BoKovN nhưng vì một số lý do điều này không mở trên ios.
phần có liên quan của mã:
//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)
Bất kỳ workaround để tiếp tục sử dụng quy mô và swiper trên phiên bản mới này của ios? Bất cứ ai cũng có một vấn đề tương tự?
Cảm ơn! :)
các codepen đầy đủ: http://codepen.io/guilhermebruzzi/full/BoKovN hiện đang hiển thị trên iphone và nó không nhấp nháy tất cả thời gian (bằng cách vuốt từ phải sang trái từ từ các thương hiệu đầu tiên đang nhấp nháy). Nó có thể là một vấn đề phân bổ gpu? –
Không phải là câu trả lời, nhưng câu trả lời của Diego đã giúp giải quyết một câu hỏi tương tự. http://stackoverflow.com/questions/32804106/angularjs-slide-transition-broken-on-safari-ios-9/32856283#32856283 –