<!DOCTYPE html>
<html>
<head>
<title>全屏循环播放(无鼠标)</title>
<style>
body, html {
margin: 0;
padding: 0;
overflow: hidden;
background: black;
cursor: none; /* 默认隐藏鼠标 */
}
#videoPlayer {
width: 100vw;
height: 100vh;
object-fit: cover;
}
</style>
</head>
<body>
<video id="videoPlayer" autoplay loop muted>
<source src="YOUR_VIDEO.mp4" type="video/mp4">
</video>
<script>
const video = document.getElementById('videoPlayer');
let mouseTimer;
// 隐藏鼠标指针
function hideCursor() {
document.body.style.cursor = 'none';
}
// 显示鼠标指针(移动时触发,2秒后隐藏)
function showCursor() {
document.body.style.cursor = 'default';
clearTimeout(mouseTimer);
mouseTimer = setTimeout(hideCursor, 2000);
}
// 初始化:隐藏鼠标
hideCursor();
// 监听鼠标移动(短暂显示指针)
document.addEventListener('mousemove', showCursor);
// 尝试进入全屏
function enterFullscreen() {
if (video.requestFullscreen) {
video.requestFullscreen().catch(err => console.log("全屏失败:", err));
} else if (video.webkitRequestFullscreen) {
video.webkitRequestFullscreen();
}
}
// 视频播放后全屏
video.addEventListener('play', enterFullscreen);
// 点击页面恢复播放(如果被阻止)
document.addEventListener('click', () => {
if (video.paused) video.play();
});
// 禁用右键菜单
document.addEventListener('contextmenu', (e) => e.preventDefault());
</script>
</body>
</html>
--kiosk --fullscreen --autoplay-policy=no-user-gesture-required --start-fullscreen