小程序轮播图

wxml页面:

   <swiper class="swiper" indicator-dots="true" autoplay="true" interval="2000" duration="1000">    
      <block wx:for="{{movies}}" wx:for-index="index">    
        <swiper-item>    
          <image src="{{item.url}}" class="slide-image" mode="aspectFill"/>    
        </swiper-item>    
      </block>    
    </swiper>   

轮播属性说明:

 

wxss页面:

.swiper {
  height: 600rpx;
  width: 100%;
}
.swiper image {
  height: 100%;
  width: 100%;
}

js页面:

Page({
  data: {
    showView: true,
    animationData: {},
    slide: [],
    sysinfo: {},
    list: [],
    cats: [],
    copyright: '',

    //轮播图片
    imgUrls: [
      {url:'/yyf_company/resource/images/swiper.png'},
      { url:'/yyf_company/resource/images/swiper.png'},
      { url:'/yyf_company/resource/images/swiper.png'}
    ]
  }
})

 

posted @ 2017-11-01 15:33  小蘑菇123  阅读(665)  评论(0编辑  收藏  举报