wxml

覆蓋組件

<video?src="../image/1.mp4"?controls="{{false}}"?event-model="bubble">

??<cover-view?class="controls">

????<cover-view?class="play"?bind:tap="play">

??????<cover-image?class="img"?src="../image/2.jpg"?/>

????</cover-view>

????<cover-view?class="pause"?bind:tap="pause">

??????<cover-image?class="img"?src="../image/1.jpg"?/>

????</cover-view>

????<cover-view?class="time">00:00

????</cover-view>

??</cover-view>

</video>

+

Page({data: {indicatorDots: true,vertical: false,autoplay: true,interval: 2000,duration: 500,imgurls: ["../image/2.jpg", "../image/1.jpg", "../image/3.jpg", "../image/4.jpg", "../image/5.jpg"]},onReady() {this.videoCtx = wx.createVideoContext('myvideo')},play(){this.videoCtx.play()},pause(){this.videoCtx.pause()},

+?

/* pages/test/test.wxss */
.controls {position: relative;top: 50px;height: 50px;margin-top: -25px;display: flex;
}.play, .pause, .time {flex: 1;height: 100%;
}.time {text-align:  center;background-color: rgb(0, 0, 5);color: white;line-height: 50px;
}.img {width: 40px;height: 40px;margin: 5px auto;
}