自定义轮播图

谁借莪１个温暖的怀抱￠ 2021-09-19 04:20 325阅读 0赞

![20190430101837962.png][]

/* 轮播图 */
    
    swiper-container {
        position: relative;
        
       
    }
    
    .swiper-container .swiper {
        height: 350rpx;
         background: #fff;
     
    }
    
    .swiper-container .swiper .img {
        width: 96%;
        height: 300rpx;
        border-radius: 20rpx;
         box-shadow:5px 5px 20px #C9C9C9;
    }
    
    .swiper-container .dots {
        padding-top: 20rpx;
        display: flex;
        justify-content: center;
        background:none;
    }
    
    .swiper-container .dots .dot {
        margin: -40rpx 8rpx;
        width: 20rpx;
        height: 15rpx;
        background: #ccc;
        border-radius: 15rpx;
        transition: all 0.6s;
    }
    
    .swiper-container .dots .dot.active {
        width: 30rpx;
        /* background: #f80; */
        background: linear-gradient(to bottom right, #f6743b , #f33a3e);
    }

data：{
       
      // 轮播
        swiperCurrent: 0,
        imgUrls: [
          '../../img/Famous/1.jpg',
          '../../img/Famous/2.jpg',
          '../../img/Famous/3.jpg'
        ],
    }
      // 轮播
      swiperChange: function(e) {
        this.setData({
          swiperCurrent: e.detail.current
        })
      },

[20190430101837962.png]: /images/20210724/8ede397b4829454fbfe3ca011c8f40b7.png