search

ElemeFE / mint-ui

Mobile UI elements for Vue.js
http://mint-ui.github.io/#!/en
MIT License
16.56k stars 3.55k forks source link

[Bug Report] Swiper自动轮播的时候，在android手机下，有闪动 #1037

Open wjhcc2018 opened 7 years ago

wjhcc2018 commented 7 years ago

Mint UI version

2.2.9

OS/Browsers version

andriod 微信浏览器

Vue version

2.3.4

Reproduction Link

https://elementui.github.io/issue-generator/#/zh-CN?repo=mint

Steps to reproduce

设置:auto="3000" ，在手机里什么都不做，发现有闪动

What is Expected?

没有闪动

What is actually happening?

有闪动

wjhcc2018 commented 7 years ago

<mt-swipe-item v-for="(banner,index) in product.images" :key="banner.id" :style="{backgroundImage:'url('+banner+')'}" :class="'background' + index "> </mt-swipe-item> 因为我是bind的src，好像有延迟问题

wjhcc2018 commented 7 years ago

我查了查，好像是transition（css3）的问题，网上说要设置这个： -webkit-backface-visibility: hidden;（设置进行转换的元素的背面在面对用户时是否可见：隐藏） -webkit-transform-style: preserve-3d; （设置内嵌的元素在 3D 空间如何呈现：保留 3D ） 但是效果不明显，也会有白边

tangdw commented 7 years ago

我也是，自动播放时，页面上其他图片一闪一闪的

wjhcc2018 commented 7 years ago

@tangdw 是的，我已经换了个插件了

tangdw commented 7 years ago

@Say-Hello 这个属性 backface-visibility: hidden; 是要设置在页面其他元素上，不是设在 transtion 的元素上。我的试了不闪了。你可以试试： | * { backface-visibility: hidden; }