trx
Published on 2025-04-18 / 52 Visits
0

111

<!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