小程序图片和视频一起轮播

小程序图片和视频一起轮播

test.wxml

<swiper class="swiper" indicator-dots="true" autoplay="{{flag}}" interval="5000" duration="1000"> <swiper-item> <video id="myVideo" src='***.mp4' bindtap="bofang" controls='true'></video> </swiper-item> <block wx:for="{{movies}}" wx:for-index="index"> <swiper-item> <image src="{{item.url}}" class="slide-image" mode="aspectFill"/> </swiper-item> </block> </swiper>

index.js

Page({ data: { movies: [ { url: 'http://img04.tooopen.com/images/20130712/tooopen_17270713.jpg' }, { url: 'file://192.168.203.1/%E5%85%B1%E4%BA%AB/Chrysanthemum.jpg' }, { url: 'http://192.168.203.1/Chrysanthemum.jpg' } ] }

index.wxss

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