小辣椒 发表于 2024-8-29 21:12

最后的人不是你 （学习套用黑黑孤夜舞原生态歌词频谱播放器）


<style>
#mama {
        margin: 140px 0 30px calc(50% - 781px);
        width: 1400px;
        height: 744px;
        background: url('https://xlaj.cn/assets/file/zp/20230905113147.jpg') no-repeat center/cover;
        box-shadow: 0 0 8px gray;
        overflow: hidden;
        z-index: 1;
        position: relative;
}
#mama > video {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
        mix-blend-mode: color-burn;
        -webkit-mask: linear-gradient(to right top, red 10%, transparent 90%, transparent);
        pointer-events: none;
}
</style>

<div id="mama" class="mama">
        <audio src="https://aod.cos.tx.xmcdn.com/storages/2250-audiofreehighqps/FB/26/GMCoOSEIyROyACAAAAJUw4WU.flac" autoplay loop></audio>
        <video src="https://vlkv-1254134120.cos.ap-guangzhou.myqcloud.com/xtq.mp4" autoplay loop muted></video>
</div>

<script>
var sf = document.createElement('script');
sf.charset = 'utf-8';
sf.src = 'https://638183.freep.cn/638183/web/js2024/oscpp_yslrc.js';
document.body.appendChild(sf);

sf.onload = () => {
        HCPlayer({
                papa: '#mama',
                geci: geci,
                skip: 0,
                average: 0,
                pinpu: {num: 300, size: 1, gap: 0.5, color1: '#a14e26', color2: '#ffffff'},
                player_css: `
                        left: 50%;
                        transform: translateX(-50%);
                        bottom: 20px;
                        color: white;
                        --hh: 100px;
                        --discBg: url('https://xlaj.cn/assets/file/zp/20230905113059.png') center/cover;
                `,
                lrc_css: 'left: 50%; transform: translateX(-50%); top: 80px; --bg: linear-gradient(lightblue, plum); color: #FFF;',
                fs_css: 'right: 48%; top: 70%; --bg: transparent; --color: #999;',
        });
};

var geci = `
        最后的人不是你(Live 合唱版)-丁乙
词：陈一龙
曲：陈一龙
编曲：王亚东
混音：王亚东
吉他：杨春
和声：小佑
录音：赵会涛
制作人：刘浩
出品人：刘浩
OP：乐豪文化
也许我一开始
就不该遇见你
也许我这辈子
不该爱上你
那曾经的甜蜜
已慢慢成回忆
现在只剩下我
哭泣在夜里
窗外的风吹起
雨落一滴滴
可是我的伞下
再也没有你
如今你在哪里
谁又爱着你
可惜陪我最后
的人不是你

也许我一开始
就不该遇见你
也许我这辈子
不该爱上你
那曾经的甜蜜
已慢慢成回忆
现在只剩下我
哭泣在夜里
窗外的风吹起
雨落一滴滴
可是我的伞下
再也没有你
如今你在哪里
谁又爱着你
可惜陪我最后
的人不是你
窗外的风吹起
雨落一滴滴
可是我的伞下
再也没有你
如今你在哪里
谁又爱着你
可惜陪我最后
的人不是你
`;
</script>

小辣椒 发表于 2024-8-29 21:13

@马黑黑

感谢黑黑分享源码，套用玩一个

小辣椒 发表于 2024-8-29 21:14

@走过岁月

岁月太喜欢这个背景效果了，忍不住用了你的链接{:4_179:}

走过岁月 发表于 2024-8-29 21:16

坐一下沙发

走过岁月 发表于 2024-8-29 21:16

有和声的好听

走过岁月 发表于 2024-8-29 21:18

背景效果不错，配上这个播放器很好

走过岁月 发表于 2024-8-29 21:18

小辣椒的精彩制作很赞

小辣椒 发表于 2024-8-29 21:19

走过岁月 发表于 2024-8-29 21:18
小辣椒的精彩制作很赞

谢谢岁月鼓励{:4_173:}

小辣椒 发表于 2024-8-29 21:20

走过岁月 发表于 2024-8-29 21:18
背景效果不错，配上这个播放器很好

我也是喜欢这个背景，有场景感

小辣椒 发表于 2024-8-29 21:20

走过岁月 发表于 2024-8-29 21:16
有和声的好听

现在最通行的都是带和声的歌曲了

马黑黑 发表于 2024-8-29 21:42

{:4_174:}

彩云归 发表于 2024-8-30 06:46

精彩！谢谢分享！

起个网名好难 发表于 2024-8-30 07:43

https://5b0988e595225.cdn.sohucs.com/images/20170922/41277604a40345cc85b0c8e0bc0b99e1.gif

梦油 发表于 2024-8-30 09:05

和声歌曲真好听。

红影 发表于 2024-8-30 13:26

这制作很漂亮，示波频谱播放器的颜色也调得很漂亮。
欣赏亲爱的好帖{:4_199:}

梦江南 发表于 2024-8-30 13:41

制作真漂亮！{:4_199:}

老谟深虑 发表于 2024-8-30 14:26

         制作的精彩，点赞支持！

朵拉 发表于 2024-8-30 15:02

制作精美，欣赏再欣赏{:4_178:}
页: [1]
查看完整版本: 最后的人不是你 （学习套用黑黑孤夜舞原生态歌词频谱播放器）