小程序 · 2021年12月5日 0

小程序解决轮播图倒角(圆角),IOS无法生效的问题

小程序解决轮播图倒角(圆角),IOS无法生效的问题

HTML


<!-- 轮播图 -->
<swiper class="screen-swiper"     :circular="true"
:autoplay="true" interval="5000" duration="500" :indicator-color="bannerDotColor" :indicator-active-color="bannerDotActiveColor">
    <swiper-item v-for="(item,index) in swiperList" :key="index">
        <image :src="item.url" mode="aspectFill" v-if="item.type=='image'"></image>
        <video :src="item.url" autoplay loop muted :show-play-btn="false" :controls="false" objectFit="cover" v-if="item.type=='video'"></video>
    </swiper-item>
</swiper>

CSS

.screen-swiper{
    box-shadow:0px 20upx 14upx -20upx #000; border-radius:10px; 
     -webkit-backface-visibility: hidden;
     -webkit-transform: translate3d(0, 0, 0);
}