神战

马黑黑

马黑黑

帖子代码

<style>
#papa {
	margin: 30px 0 30px calc(50% - 721px);
	width: 1280px;
	height: 720px;
	background: url('https://638183.freep.cn/638183/t24/webp/ufvj.webp') no-repeat center/cover;
	box-shadow: 0 0 8px gray;
	overflow: hidden;
	z-index: 1;
	display: grid;
	place-items: center;
	position: relative;
}
#papa > video {
	position: absolute;
	width: 100%;
	height: calc(100% + 200px);
	object-fit: cover;
	opacity: .45;
	mix-blend-mode: screen;
	pointer-events: none;
}
</style>

<div id="papa" class="papa">
	<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2119431158" autoplay loop></audio>
	<video src="https://img.tukuppt.com/video_show/6181262/01/32/34/62da7f2c520c9.mp4" autoplay loop muted></video>
</div>

<script>
var geci = `[00:00.08]《神战》\n[00:06.81]制作人/企划：花君\n[00:08.99]作词：辛夷\n[00:10.18]曲作：宏宇\n[00:11.36]编曲：徐铭轩/RK\n[00:14.61]吉他/贝斯：RK\n[00:17.17]混音：小吴太太\n[00:20.35]演唱：鱼不归/七某人/宁采臣/艾森\n[00:25.22]出品：满汉全席音乐团队\n[00:29.05]谁淬长钩？细从头，来路几坐荒丘\n[00:31.60]看那迦朽，龟血流，诸天神佛束手\n[00:34.26]便揽轻衫，曼歌直上七重天，蹴踏梵丘\n[00:37.43]且只手，翻又覆，风云聚首，水漫大洲\n[00:40.22]占断狂游，何妨某，不许人间白头\n[00:42.45]天女婆娑，莲华御座一时英雄如斗\n[00:45.30]再对坐仙人危楼，万物焉腐朽\n[00:50.19]满室琉璃如昼，蜜蜡载酒，美人着黄绸\n[00:55.83]摘花折叶作个酒筹，忽一人辩我蜉蝣，迦楼罗引谁作某对手\n[01:01.66]对手，回眸\n[01:04.06]夜半聊坐弥卢殿\n[01:05.44]翻手古海作天\n[01:06.99]醍醐妙法暂寄一梦\n[01:09.10]沧海一粟 笑天地无用\n[01:15.04]夜半聊坐弥卢殿\n[01:16.41]覆手妙法自现\n[01:17.94]哪个敢再笑痴人梦\n[01:20.05]万斛风云难藏一锋\n[01:24.08]某当添为第一峰\n[01:37.70]我淬长钩，细从头，来路几过废丘\n[01:40.03]听流水朽，海风飕，诸天神佛束手\n[01:42.76]便揽轻衫，曼歌直上七重天，蹴踏梵丘\n[01:45.50]天与地，困兽斗，迭出妙手，倏忽春秋\n[01:48.47]夜半高楼，何妨某，不识天高地厚\n[01:50.96]人间筹谋，天地绸缪，不过万事皆休\n[01:53.81]再从头细算一劫，谁夜又如昼\n[01:58.82]诸天琉璃如昼，人间载酒，美人如丝绸\n[02:04.42]点尽琳琅作酒筹，谁一人共我运筹，帷幄间犹有棋局未休，\n[02:10.32]未休，守候\n[02:12.69]夜半聊坐弥卢殿\n[02:14.17]翻手古海作天\n[02:15.66]醍醐妙法暂寄一梦\n[02:17.70]沧海一粟 笑天地无用\n[02:23.65]夜半聊坐弥卢殿\n[02:25.00]覆手妙法自现\n[02:26.49]哪个敢再笑痴人梦\n[02:28.66]万斛风云难藏一锋\n[02:32.69]某当添为第一峰\n[02:56.67]夜半聊坐弥卢殿\n[02:57.91]翻手古海作天\n[02:59.41]再看四洲山阙重\n[03:01.71]万斛风云难藏此一锋\n[03:07.46]夜半聊坐弥卢殿\n[03:08.95]覆手妙法自现\n[03:10.56]再看四海浪花空\n[03:12.55]神战不过谁人一梦之中\n[03:16.95]劫灰后，又相逢\n[03:21.21]2024-8-16`;

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

sf.onload = () => {
	HCPlayer({
		papa: '#papa',
		geci: geci,
		skip: 0,
		average: 0,
		pinpu: {num: 60, width: 8, height: 150, color: 'transparent'},
		player_css: 'bottom: 20px; color: #eee; --prog: white; --track: silver; --cap: snow',
		lrc_css: 'top: 20px; --bg: linear-gradient(#fff, #fff, #ffffff08); color: silver;',
		fs_css: '--bg: transparent; --color: snow;'
	});
};
</script>

马黑黑

本帖测试原生lrc歌词同步的普通频谱插件，把频谱 color 配置参数设置为 transparent 只留频谱帽，就是帖子中播放器的最终效果。该 color 参数支持颜色、渐变、图片背景，参数值是字符串，要有小角引号。

更多插件配置说明请移步：原生lrc歌词同步之普通频谱播放器 (52qingyin.cn)

起个网名好难

                               
登录/注册后可看大图

频谱是模拟的吧

小文

真心喜欢！问好先生

梦江南

老师辛苦了，真棒！

彩云归

欣赏佳作，谢谢！

马黑黑

彩云归 发表于 2024-8-16 17:15
欣赏佳作，谢谢！

感谢支持，晚上好

马黑黑

起个网名好难 发表于 2024-8-16 08:28
频谱是模拟的吧

是的

马黑黑

梦江南 发表于 2024-8-16 14:15
老师辛苦了，真棒！

感谢

马黑黑

小文 发表于 2024-8-16 09:22
真心喜欢！问好先生

谢谢，晚上好

小辣椒

现在才看见这个新帖，黑黑这个频谱播放器漂亮的

小辣椒

封装好的套用会很快，今天迟了一点，争取明天完成作业

小辣椒

黑黑辛苦，这个播放器效果很喜欢

小辣椒

今天上来没有先找黑黑的帖，看见太迟了，回帖太多，暂时不回了，去做帖，套用玩一个

红影

这个好看，欣赏黑黑好帖

马黑黑

红影 发表于 2024-8-16 23:37
这个好看，欣赏黑黑好帖

感谢管管鼓励

马黑黑

小辣椒 发表于 2024-8-16 22:23
今天上来没有先找黑黑的帖，看见太迟了，回帖太多，暂时不回了，去做帖，套用玩一个

不要太劳累

红影

马黑黑 发表于 2024-8-17 07:33
感谢管管鼓励

哎呀，咋这样叫啊，这里都是玩的人，哪分什么管不管的