代码简单，页面简洁，支持自动连续播放，兼容微信不用全屏就能播放，第一次打开手动点击播放；
视频链接添加到ks.txt文件中，每行一条链接地址，自行添加即可；

效果演示

index.html – 入口页面

<!DOCTYPE html><html lang="zh-CN"><head>
    <meta charSet="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta http-equiv="Cache-Control" content="no-transform" />
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="referrer" content="never">
    <meta name="renderer" content="webkit" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title> XJJ </title>
    <link rel="stylesheet" href="style.css"></head><body>
    <section id="main">
        <video id="player" src="video.php" controls webkit-playsinline playsinline></video>
    </section>
    <section id="buttons">
        <button id="switch">连续: 开</button>
        <button id="next">播放下一个</button>
    </section>
    <script>
    (function (window, document) {        if (top != self) {            window.top.location.replace(self.location.href);
        }        var get = function (id) {            return document.getElementById(id);
        }        var <a target="_blank" href="https://www.lihaiblog.cn/tags-252.html">BI</a>nd = function (element, event, callback) {            return element.addEventListener(event, callback);
        }        var auto = true;        var player = get('player');        var randomm = function () {
            player.src = 'video.php?_t=' + Math.random();
            player.play();
        }
        bind(get('next'), 'click', randomm);
        bind(player, 'error', function () {
            randomm();
        });
        bind(get('switch'), 'click', function () {
            auto = !auto;            this.innerText = '连续: ' + (auto ? '开' : '关');
        });
        bind(player, 'ended', function () {            if (auto) randomm();
        });
    })(window, document);    </script>      </body></html>

style.css – 样式

* {    border: 0;    margin: 0;    padding: 0;    outline: none;    box-sizing: border-box;
}body {    background: #000;    width: 100vw;    height: 100vh;    overflow: hidden;    display: flex;    flex-direction: column;    align-items: center;
}#main {    height: calc(100vh - 60px);    display: flex;    justify-content: center;    align-items: center;
}#player {    width: 100%;    height: auto;    max-height: 100%;
}#buttons {    height: 60px;    padding: 10px;
}#switch,#next {    background: #FFF;    background: linear-gradient(to bottom, #FF2,#FB0);    color: #AF2E08;    font-size: 16px;    font-weight: bold;    height: 40px;    padding: 0px 20px;    margin: 0px 5px;    border-radius: 20px;
}

video.php – 随机获取视频API

<?phpfunction read(...$filelist) {
    $list = [];    foreach ($filelist as $file) {
        $handle = fopen($file, 'r');        while (($line = fgets($handle)) !== false) {
            array_push($list, trim($line));
        }
        fclose($handle);
    }    return $list;
}

$list = read('ks.txt');
$url = $list[array_rand($list)];

header("Location: {$url}");

ks.txt – 视频列表

此处内容已隐藏，请评论后刷新页面查看.

温馨提示：本文最后更新于2022/10/20 16:19:39。若文章内容或图片失效，请留言或联系站长反馈！

也想出现在这里？点击联系我们吧

本站除原创内容，其余内容均收集自互联网，仅限用于学习和研究目的，本站不对其内容的合法性、可用性承担任何责任。本站禁止以任何形式发布或转载任何违法相关信息，若您发现请立即向站长举报；用户投稿一切资源内容不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
如有版权内容，其版权均归原作者所有，本站虽力求保存原有版权信息，但因众多资源经多次转载，已无法确定其真实来源，故敬请原作者谅解！为尊重作者劳动成果，请购买正版支持作者，谢谢！若您对「HULIKU.COM」所载资源作品版权归属存有异议，请发送邮箱：ihuliku@qq.com 进行处理。
本站资源文件大多存储至云盘，如您发现图片或链接失效，请联系站长或作者，我们将及时进行更新。资源都是经过站长或作者收集测试优化后进行发布分享。如若转载请在贵站文内以超链形式注明狐狸库文章出处，谢谢合作！

THE END

建站笔记
# 单页源码