From a988d074b876d2e7e6079829e13988767e3ec460 Mon Sep 17 00:00:00 2001
From: Administrator <15274802129@163.com>
Date: Fri, 16 Jan 2026 09:45:33 +0800
Subject: [PATCH] feat(video): 添加视频自动全屏功能
---
src/main/resources/static/febs/videoNative.html | 32 +++++++++++++++++++++++++++++---
1 files changed, 29 insertions(+), 3 deletions(-)
diff --git a/src/main/resources/static/febs/videoNative.html b/src/main/resources/static/febs/videoNative.html
index 90a4b11..72d946b 100644
--- a/src/main/resources/static/febs/videoNative.html
+++ b/src/main/resources/static/febs/videoNative.html
@@ -177,6 +177,20 @@
});
}
+ // 兼容不同浏览器的全屏请求函数
+ function requestFullscreen(element) {
+ if (element.requestFullscreen) {
+ return element.requestFullscreen();
+ } else if (element.mozRequestFullScreen) {
+ return element.mozRequestFullScreen();
+ } else if (element.webkitRequestFullscreen) {
+ return element.webkitRequestFullscreen();
+ } else if (element.msRequestFullscreen) {
+ return element.msRequestFullscreen();
+ }
+ return Promise.reject(new Error('当前浏览器不支持全屏API'));
+ }
+
// 加载视频
function loadVideo(videoUrl) {
var videoPlayer = document.getElementById('videoPlayer');
@@ -212,9 +226,21 @@
showMessage('视频加载中...', 'success');
- // 视频加载完成事件
- videoPlayer.addEventListener('loadedmetadata', function() {
- showMessage('视频加载完成', 'success');
+ // 视频可以播放时尝试自动全屏
+ videoPlayer.addEventListener('canplay', function() {
+ showMessage('视频加载完成，正在尝试自动全屏...', 'success');
+ // 尝试自动全屏
+ requestFullscreen(videoPlayer).then(function() {
+ showMessage('视频已自动全屏', 'success');
+ }).catch(function(error) {
+ showMessage('自动全屏失败，可能需要手动点击播放', 'error');
+ console.log('全屏请求失败:', error);
+ });
+ // 开始播放
+ videoPlayer.play().catch(function(error) {
+ showMessage('自动播放失败，可能需要手动点击播放', 'error');
+ console.log('自动播放失败:', error);
+ });
});
// 视频加载错误事件
--
Gitblit v1.9.1