小程序需要来一个过年祝福视频开头,废话不多说直接上代码

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;
		}
	}
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐