UID217
阅读权限150
主题
帖子
精华
积分140177
文采 点
钻石 颗
鲜花 朵
金币 枚
注册时间2020-7-30
最后登录1970-1-1
|
楼主 |
发表于 2024-7-3 14:17
|
显示全部楼层
<style>#papa { margin: 0 0 0 calc(50% - 831px);  width: 1600px; height: 800px; background: url('http://bbs.zjiao.net/data/attachment/forum/202402/20/151106nvwxqjo3ggpwtvup.jpg') no-repeat center/cover; box-shadow: 4px 4px 8px black; overflow: hidden; display: grid; place-items: center; z-index: 1; position: relative; --state: running; }
#vid1 {
    position: absolute;
    width: 120%;
    height: 120%;
    top:-100px;
    left:-301px;
    object-fit: cover;
    pointer-events: none;
    mix-blend-mode: screen;
    z-index:3;
    opacity: .66;
}
#vid2 {
    position: absolute;
    width: 100%;
    height: 110%;
    top:-80px;
    object-fit: cover;
    pointer-events: none;
    mix-blend-mode: screen;
    z-index: 5;
    opacity: .19;
}</style>
<div id="papa">
<video id="vid1" src="https://img.tukuppt.com/video_show/2269348/00/14/16/5e1c7be4c80dd.mp4" autoplay="" loop="" muted=""></video>
<video id="vid2" src="https://img.tukuppt.com/video_show/2475824/00/01/59/5b46b977d9e77.mp4" autoplay="" loop="" muted=""></video>
</div>
<audio id="aud" src="http://music.9yuefeng.com/forum.php?mod=attachment&aid=MTExfDEwMmZkNDZkfDE3MDgzMDE4MDZ8MjZ8OTY%3D.mp3" autoplay="" loop=""></audio>
<script>(function() {
    let script = document.createElement('script');
    script.src = 'https://638183.freep.cn/638183/web/api/anklet_lrc.js';
    script.charset = 'utf-8';
    document.head.appendChild(script);
    let geci = [     
                [1.12,"单曲：明明",1.5],
    [2.58,"所属专辑：“海边岩下白山猹”",1.6],
    [4.2,"原唱：周深",1.6],
    [5.82,"翻唱：白浅熙/猹猹子",1.4],
    [7.26,"后期：陌九",1.1],
    [8.31,"学习黑师《变奏的梦想 - 酹江月》脚链频谱效果",5.5],
    [19,"念念不忘情未了 在耳鬓厮咬",5.9],
    [26.64,"回忆触了礁 无处停靠",5.5],
    [33.79,"两两相望 雨潇潇 谁化作云烟飘渺",6.1],
    [41.04,"留下心的孤岛 做无岸波涛",6.1],
    [50.1,"明明你知道 明明我明了",2.9],
    [53.44,"明明爱锁在眼底缠绕",3.1],
    [57.04,"为一个拥抱 用一生灼烧",3.4],
    [61.01,"在千帆过尽里寻找",2.5],
    [64.05,"明明你知道 明明我明了",3.7],
    [68.07,"明明愿生生誓死缠绕",3.1],
    [72.07,"为一刻心跳 用天荒凭吊",3.1],
    [76.03,"永不离散 我们早说好",4.2],
    [96,"念念不忘情未了 在耳鬓厮咬",5.5],
    [103,"回忆触了礁 无处停靠",5.8],
    [110.35,"爱恨纷扰忘不了 就算隔天地遥遥",6.1],
    [117.92,"灵魂相拥惊扰怎一笔勾销",5.7],
    [126.04,"明明你知道 明明我明了",3.5],
    [129.93,"明明爱锁在眼底缠绕",3.1],
    [133.04,"为一个拥抱 用一生灼烧",3.9],
    [137.62,"在千帆过尽里寻找",2.5],
    [141.03,"明明你知道 明明我明了",3.2],
    [144.68,"明明愿生生誓死缠绕",3.1],
    [148.45,"为一刻心跳 用天荒凭吊",3.2],
    [152.72,"永不离散 我们早说好",3.9],
    [174.07,"明明你知道 明明我明了",3.2],
    [177.75,"明明爱锁在心底缠绕",3.0],
    [181.06,"为一个拥抱 用一生灼烧",3.6],
    [185.22,"在无尽覆辙里重蹈",2.6],
    [188.98,"明明你知道 明明我明了",3.0],
    [192.44,"明明抹不掉魂牵梦绕",3.0],
    [196.08,"为一刻心跳 用天荒凭吊",3.6],
    [200.18,"留住你一眼 哪怕多一秒",6.5] ];
    script.onload = () => {
        HCPlayer({
            papa: '#papa',
            lrcAr: geci,
lrc_css: 'bottom: 20px;  --bg: linear-gradient(rgba(240,240,180,.2),rgba(240,240,180,.4)); color: Wheat;',
                      fs_css: 'bottom: 10px; background: transparent;color: white;left:5%;bottom:5%;',
                   player_css: `
                   top: 380px;
                               left:230px;
                border-width: 0;
                color: #fff;
                --size: 160px;
                --bRad: 30%;
                --track: gray;
                --prog: lightblue;
                --btnBg: linear-gradient(orange, snow);
            `,
            lizi: { color1: 'lightyellow', color2: 'silver' },
        });
    };
    [...new Array(5).keys()].forEach((e,k) => {
        e = document.createElement('span');
        e.className = 'meteor';
        e.style.cssText += `
            left: ${50 * Math.random()}%;
            top: ${10 * Math.random()}%;
            --du: ${3 + Math.random() * 2}s;
            --delay: -${Math.random() * 1}s;
            --ww: ${25 + Math.random() * 10}px;
        `;
        papa.appendChild(e);
    });
})();
document.querySelector('.mydiv').onclick = () => aud.paused ? vid.pause() : vid1.play();</script>
|
评分
-
1
查看全部评分
-
|
雷达卡
发表于 2024-7-3 11:03
发表于 2024-7-3 21:33