小程序video进入、退出全屏事件

最新推荐文章于 2024-03-01 16:14:37 发布

xx_小熊

最新推荐文章于 2024-03-01 16:14:37 发布

阅读量8.7k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_42975998/article/details/89114274

本文介绍了一种使用HTML和JavaScript实现的视频播放器全屏切换功能。通过监听全屏状态变化事件，动态调整播放器的控制条显示状态，提供更佳的用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html:

<video bindfullscreenchange="screenChange" src='{{article.video}}'></video>

js:

screenChange(e){
	 let fullScreen = e.detail.fullScreen //值true为进入全屏，false为退出全屏
	 if (!fullScreen ){ //退出全屏
	   this.setData({
	     controls: false
	   })
	 }else{ //进入全屏
	  this.setData({
	     controls: true
	   })
	 }
},