背景描述：
1、产品需要banner类似京东app详情页中banner，第一个swiper-item为视频，后面的swiper-item为图片。
2、video组件是由客户端创建的原生组件，它的层级是最高的，不能通过 z-index 控制层级。微信官方已经说明video组件层级最高，并且不能通过z-index来控制
3、设置第一张图片为视频的占位图片，当点击图片时，将当前占位图片隐藏，显示视频播放器；并添加一个纯黑和banner宽高一样的图层，绝对定位，用来放左右切换按钮，控制banner左右滑动
wxml代码：
view class='banner-wrapper' swiper indicator-dots indicator-color="{{indicator}}" current="{{current}}" indicator-active-color="{{activeIndicator}}" class="bn-swiper" bindchange="bannerChage" duration="300" block wx:for="{{storeImgs}}" wx:key="bn_urls" swiper-item block wx:if="{{item.type == 1}}" view wx:if="{{isPlay}}" class='video-wrapper' video src="{{item.src}}" class='video' controls id='myVideo'/video /view view wx:else class='video-host-wrapper' catchtap='play' image src="{{storeImgs[1].src}}" mode='aspectFill' / image src='/images/play.png' class='play-icon'/image /view /block image src="{{item.src}}" mode='aspectFill' catchtap='preview' data-url="{{item.src}}" wx:else/ /swiper-item /block /swiper view class='banner-mask' wx:if="{{isPlay}}" image src='/images/arrow.png' class='prev' catchtap='goPrev'/image image src='/images/arrow.png' class='next' catchtap='goNext'/image /viewjs代码：
data：{ storeImgs: [],//banner current:0,//banner当前的index }
效果：
