<script>
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);

var text = `[00:00.00]歌词一\n[00:00.947]歌词二\n[00:05:321]……\n[00:04.239]歌词N`;

sf.onload = () => {
	HCPlayer({
		papa: '#mydiv',
		geci: text,
		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>

sf.onload = () => {
	HCPlayer({
		papa: '#mydiv', /* 使用id或class选择器名称向插件指定帖子容器 */
		geci: geci, /* 指定lrc歌词 ：需要事先声明 */
		skip: 0, /* 歌词起唱时间偏移量，可缺省 */
		average: 0, /* 歌词演唱平均用时调整系数，可缺省 */
		 /* 频谱设置（可缺省）： num - 频谱数；width：频谱条宽度；height：频谱条高度；color：频谱条颜色，注意引号，支持颜色、渐变和图片背景 */
		pinpu: {num: 60, width: 8, height: 150, color: 'transparent'},
		/* 播放器界面设置，可缺省 */
		player_css: `
			left: 20px; /* 也可以用 right */
			bottom: 20px; /* 也可以用 top */
			color: #eee; /* 时间文本颜色 */
			--prog: white; /* 进度颜色 */
			--track: silver; /* 进度底轨色 */
			--cap: snow, /* 频谱帽颜色 */
		`,
		/* lrc歌词同步界面，可缺省 */
		lrc_css: `
			left: 30px; /* 也可以用 right */
			top: 100px; /* 也可以用 bottom */
			--bg: linear-gradient(#fff, #fff, #ffffff08); /* 同步色，支持纯颜色和渐变、图像背景 */
			color: silver; /* 歌词底色，仅支持颜色 */
		`,
		/* 全屏按钮界面设置，可缺省 */
		fs_css: `
			left: 20%; /* 按钮left位置，也可以使用 right */
			top: 20%; /* 按钮top位置，也可以使用 bottom */
			--bg: transparent; /* 按钮背景色 */
			--color: snow; /* 按钮前景色 */
		`,
	});
};

//可缺省的参数去掉，CSS配置部分使用默认配置
sf.onload = () => {
	HCPlayer({
		papa: '#mydiv',
		geci: text,
		lrc_css: 'left: 200px; top: 20px;',
		player_css: 'left: 200px; bottom: 20px;',
		fs_css: 'left: 20px; top: 20px;',
	});
};