本帖最后由 花简静 于 2025-2-5 19:06 编辑
<style>
@import 'https://638183.freep.cn/638183/web/mod/btn_lrc.css';
#tz { --state: running; margin: 130px 0 30px calc(50% - 931px);width:1700px; height: 900px; background: url('https://642303.freep.cn/642303/tu/quwu4.webp') no-repeat center/cover; overflow: hidden;}
#fsbtn { top: -120px; }
#lrc {left: 50%;transform: translateX(-50%);bottom: 30px; --bg: linear-gradient(Wheat,#4c413b); color: silver;font: bold 2.0em cursive;opacity: .86; }
#mplayer { left: 69%; bottom:38%;width: 60px; height: 60px; display: grid; place-items: center;opacity: .26; }
.feather { position: absolute; width: 30px; height: 5px; background: url('https://pic.imgdb.cn/item/65cc3a709f345e8d037b2f2c.png') no-repeat center/cover; }
.vid { position: absolute; width: 100%; height: 100%; -webkit-mask: linear-gradient(to bottom,transparent,red); object-fit: cover; mix-blend-mode: screen;opacity: .26;}
</style>
<div id="tz" class="pa">
<audio src="https://music.163.com/song/media/outer/url?id=2649275945.mp3"></audio>
<video class="vid" src="https://bpic.588ku.com/video_listen/588ku_preview/19/07/08/16/19/29/video5d22fc9193ed1.mp4" autoplay loop muted></video>
<div id="lrc" class="lrc" data-lrc="HCPlayer">HCPlayer</div>
<div id="mplayer" class="mplayer"></div>
<div id="fsbtn" class="fsbtn"></div>
</div>
<script type="module">
import { hcplay } from 'https://638183.freep.cn/638183/web/mod/btn_lrc.js';
import fscreen from 'https://638183.freep.cn/638183/web/mod/fscreen.js';
var lrcAr = [
[-0.11,"单曲:山川之大没有你",0.2],
[0.12,"歌手:张德伊玲",3.6],
[3.7,"所属专辑:山川之大没有你",1.6],
[5.27,"作词 : 南铃子",1.2],
[6.45,"作曲 : 南铃子",0.9],
[7.36,"编曲:卡其漠罗洋",0.8],
[8.19,"吉他:大牛",0.8],
[9.01,"和声:米茶",0.8],
[9.8,"混音:钟泽鑫",0.8],
[10.59,"艺人统筹:张鹏闻",0.9],
[11.54,"音乐统筹:贝贝",0.9],
[12.39,"制作人:贝贝",0.9],
[13.34,"监制:小小晞",0.8],
[14.13,"策划:小小晞/冯妍然",0.8],
[14.95,"封面:沈秋离",0.9],
[15.81,"题字:Misakii",0.8],
[16.64,"出品:又见清杉",0.2],
[16.93,"我在寺里寻找神明",3.9],
[19.07,"求他给我指引哪里才能找到你",5.0],
[24.06,"我在海底找到了鲸",2.0],
[26.09,"想它通过声音去寻找你",5.7],
[32.27,"我在梦境反复清醒",1.8],
[34.04,"只想让漂泊的心靠近你",4.7],
[40,"我在荒芜里看白云",2.0],
[42.04,"让它洗涤我的眼睛",2.6],
[47.09,"可可西里依旧没有声音是生命禁区",4.8],
[52.09,"你爱的风吹向哪里上海或北京",3.6],
[56.03,"或许你在看秦始皇的兵",2.7],
[59.08,"我在鼓浪屿听戏曲",2.9],
[62.04,"长白山没有圣域",2.0],
[64.05,"西湖没有吴山居",2.0],
[66.02,"就像孤单的我没有爱我的你",3.7],
[70.18,"开封没有了秋菊",1.9],
[72.05,"雅安整年在下雨",2.0],
[74.09,"西安的雁塔晨钟没响起",3.4],
[78.07,"南山陷入了回忆",1.0],
[79.06,"圆明园新上了漆",2.0],
[81.03,"而我从此后再没遇见你",4.0],
[85,"海南的风停这里",2.0],
[87.05,"盐城又来了潮汐",2.0],
[89,"山川之大没有你",4.0],
[93.18,"千山论坛h ttp://qslt.net",5.1],
[99.29,"2025元月音画版同图活动制作",5.8],
[105.29,"",3.8],
[109.01,"可可西里依旧没有声音是生命禁区",4.8],
[114.02,"你爱的风吹向哪里上海或北京",3.0],
[117.07,"或许你在看秦始皇的兵",3.0],
[120.06,"我在鼓浪屿听戏曲",4.0],
[124.07,"长白山没有圣域",2.0],
[126.04,"西湖没有吴山居",2.3],
[128.32,"就像孤单的我没有爱我的你",3.4],
[132.13,"开封没有了秋菊",2.0],
[134.14,"雅安整年在下雨",1.9],
[136.06,"西安的雁塔晨钟没响起",3.5],
[140.08,"南山陷入了回忆",1.8],
[141.85,"圆明园新上了漆",1.2],
[143.07,"而我从此后再没遇见你",4.0],
[147.09,"海南的风停这里",1.9],
[149.02,"盐城又来了潮汐",2.6],
[151.67,"山川之大没有你",3.2],
[155.03,"长白山没有圣域",2.1],
[157.08,"西湖没有吴山居",2.0],
[159.04,"就像孤单的我没有爱我的你",3.7],
[163.05,"开封没有了秋菊",2.1],
[165.14,"雅安整年在下雨",2.0],
[167.11,"西安的雁塔晨钟没响起",3.0],
[170.07,"南山陷入了回忆",1.9],
[172.01,"圆明园新上了漆",2.0],
[174.03,"而我从此后再没遇见你",4.0],
[178.01,"海南的风停这里",2.0],
[180,"盐城又来了潮汐",2.1],
[182.08,"山川之大没有你",3.7]
];
var total = 6, a = 360 / total;
for(var i = 0; i < total; i++) {
var f = document.createElement('span');
f.className = 'feather';
f.style.cssText += `transform: rotate(${i * a}deg) translateY(-10px);`;
mplayer.appendChild(f);
}
hcplay(tz, lrcAr);
fscreen.fs(tz, fsbtn);
</script>
|