本帖最后由 Mr. 于 2020-3-23 16:49 编辑
看到有人在发 XJJ 视频的页面,我也发一个,几个月前论坛里有人分享了快手的 XJJ 采集,根据这个做了个页面,一直放着。。。
代码很简单,页面很简洁,中老年配色,支持自动连续播放,主要是兼容了微信不用全屏就能播(但第一次打开还是要手动点播放)
放两个预览地址:meizi.pp.ua 和 meinv.pp.ua
代码就四个文件,视频列表文件就自己找吧,一行一个视频地址就行
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 bind = 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>
复制代码
video.php - 随机获取视频地址
- <?php
- function 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}");
复制代码
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;
- }
复制代码
ks.txt - 视频列表
- http://alimov2.a.yximgs.com/upic/2017/11/05/03/BMjAxNzExMDUwMzMyMjNfMTY5OTgwMzlfMzc2OTA5MDYwOV8xXzM=_b.mp4
- http://txmov2.a.yximgs.com/upic/2019/05/18/18/BMjAxOTA1MTgxODA4MTVfMTExNTkxMjA4Ml8xMzE4MTQ2NTUwOV8xXzM=_b_B9779e00de57a95b32ce7c7f1a6f5d344.mp4
- http://txmov2.a.yximgs.com/upic/2019/05/18/18/BMjAxOTA1MTgxODMxMzZfMjIyNDUxMTY2XzEzMTgyNDUzOTExXzFfMw==_b_B8d23190ec90818e7b12bfaa1062a518c.mp4
- http://txmov2.a.yximgs.com/upic/2019/06/10/12/BMjAxOTA2MTAxMjExNDFfNTQwMDU2NDBfMTM5MzQyMDAxNjBfMV8z_b_B83123c2961cad47d1a7214ea2524c32d.mp4
- http://hwmov.a.yximgs.com/upic/2019/07/10/21/BMjAxOTA3MTAyMTI1NTFfNDM3ODZfMTUwMjY0MzU3MzJfMV8z_b_B276364034fb4756323028e2c0bc3c3e7.mp4
- ……
- 后面自己补充
复制代码
|