小程序需要来一个过年祝福视频开头,废话不多说直接上代码
1.HTML代码
这里的视频地址最好让后台给你提供,这样不需要我们每次发版,然后判断是否展示也让后台一起返回也能自动化控制,毕竟后台发版比我们快很多
<view class="rabbit-box" v-if="rabbitShow">
<video
src="src"
class="full-page-video-horizontal" autoplay="true" :controls="false" :show-fullscreen-btn="false"
:show-play-btn="false" :show-center-play-btn="false" :show-loading="false"
:enable-progress-gesture="false" :vslide-gesture-in-fullscreen="false" @ended="videoEnd"
@error="videoEnd"></video>
</view>
2.js代码
这里就是播放结束,或者播放错误的时候 把视频给隐藏 不显示
// 视频结束
videoEnd() {
this.rabbitShow = false
uni.setStorageSync('rabbitShow', true)
},
3.css代码
.rabbit-box {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 9999;
.full-page-video-horizontal {
width: 100%;
height: 100%;
z-index: 1002;
}
}