本帖最后由 花简静 于 2024-12-29 22:11 编辑
<style>
@import 'https://638183.freep.cn/638183/web/css/audlrc.css';
#mama { margin: 130px 0 30px calc(50% - 931px);width: 1700px;height: 900px; background: black url('https://642303.freep.cn/642303/tu/20241214qwdy06.webp') no-repeat center/ cover; overflow: hidden;}
#player { width: 60px;height: 60px;left: calc(50% - 308px); top: calc(50% - 60px); filter: hue-rotate(60deg); }
#player:hover { filter: hue-rotate(30deg); transition: .7s; }
#prog { bottom: 20px; width: 220px; --bg1: #ffffffaa; --bg2: SaddleBrown; --color: snow; }
#lrc {left: 50%;transform: translateX(-50%);bottom: 30px; --bg: linear-gradient(#ffffffaa, SaddleBrown); color: silver;font: bold 2.0em cursive;opacity: .86; }
#vid { position: absolute; width: 100%; height: 110%; object-fit: cover; top:-80px; mix-blend-mode: screen;-webkit-mask: linear-gradient(to top, red 30%, transparent 55%, transparent); pointer-events: none; opacity: .95;}
</style>
<div id="mama" class="pa">
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2643859071"></audio>
<video id="vid" src="https://img.tukuppt.com/video_show/15653652/00/79/86/60c98c8146068.mp4" autoplay loop muted></video>
<div id="lrc" class="lrc" data-lrc="HCPlayer">HCPlayer</div>
<img id="player" class="player" src="https://pic.imgdb.cn/item/65c0a8f19f345e8d03032e45.png" alt="" />
<div id="prog" class="prog" data-tt="00:00 00:00"></div>
</div>
<script type="module">
import { Aud } from 'https://638183.freep.cn/638183/web/mod/audlrc.js';
var geci = [
[-0.15,"单曲：伴你 ",2.4],
[2.22,"歌手：黄绮珊",2.3],
[4.53,"所属专辑：伴你",2.2],
[6.77,"词 : 陈嬛",1.2],
[7.99,"曲 : 陈嬛",1.5],
[9.49,"制作人 : 徐可",1.2],
[10.67,"编曲 : 陈嬛/黎栩晴",1.3],
[12.01,"和声 : 刘郡格",1.2],
[13.24,"弦乐 : 中国国际爱乐乐团",1.0],
[14.26,"录音室 : 2496TopMusic",1.3],
[15.52,"录音师 : 王昆@2496TopMusic",1.1],
[16.61,"混音 : 王路遥@2496TopMusic",0.9],
[17.51,"学习黑师20241121《免我蹉跎苦》细线进度条效果",4.2],
[37.62,"你呀你",2.8],
[43.08,"浅浅身影",2.0],
[48.04,"匆匆离去",2.7],
[54.06,"不多说一句",2.4],
[60.01,"你呀你",2.0],
[65.82,"沉沉宿命",2.3],
[71.08,"开始以前",2.3],
[76.08,"结局已注定",3.3],
[80.9,"",2.1],
[83,"我愿像风",1.9],
[88.52,"向你飞去",2.3],
[94.09,"我愿像雨",2.1],
[99.81,"将你抱紧",2.6],
[105.06,"我愿像岸",2.6],
[110.75,"等你靠近",3.2],
[117.11,"愿像大地",1.9],
[123.07,"把你托起",2.1],
[125.03,"",48.1],
[175.04,"你呀你",1.7],
[180,"是个难题",2.3],
[185.08,"静静睡去",2.8],
[191.09,"不留个姓名",2.7],
[197.03,"生命",1.8],
[202.71,"太不容易",2.5],
[208.06,"短暂相聚",2.5],
[213.06,"又各奔东西",3.4],
[220.1,"我愿像风",1.8],
[225.03,"随你远行",3.1],
[231.37,"我愿像雨",1.9],
[237,"把你记起",2.4],
[242.15,"我愿像岸",2.7],
[248.1,"将你唤醒",2.9],
[254.03,"愿像大地",2.2],
[260.06,"伴你朝夕",2.2],
[266,"愿像大地",1.5],
[271.03,"陪你归去",4.5]
];
var mDatas = { pa: mama, btn: player, prog: prog, lrc: lrc, lrcAr: geci };
var audio = new Aud(mDatas);
audio.play();
</script>
|
发表于 2024-12-29 21:28