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

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

作者: 码码虎呼 | 来源:发表于2021-02-02 14:09 被阅读0次
示例
// 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);
}

相关文章

网友评论

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

      本文链接:https://www.haomeiwen.com/subject/oqrytltx.html