月落的声音（傈傈语版）
<style>#papa { margin: -80px 0 0 calc(50% - 593px); width: 1024px; height: 640px; background: gray url('https://638183.freep.cn/638183/t23/webp/lilizu.webp') center/cover no-repeat; box-shadow: 3px 3px 20px #000; position: relative; z-index: 1; --state: running; }
#lrc { --motion: cover2; --tt: 1s; position: absolute; left: 50%; transform: translate(-50%, 10px); font: bold 2.4em sans-serif; color: hsl(100, 100%, 90%); white-space: pre; -webkit-background-clip: text; filter: drop-shadow(1px 1px 2px hsla(0, 100%, 0%, .85)); z-index: 900; }
#lrc::before { position: absolute; content: attr(data-lrc); width: 20%; height: 100%; color: transparent; overflow: hidden; white-space: pre; background: linear-gradient(180deg, hsla(100, 10%, 50%, .75), hsla(100, 100%, 20%, .65)); filter: inherit; -webkit-background-clip: text; animation: var(--motion) var(--tt) linear forwards; animation-play-state: var(--state); }
#mplayer { position: absolute; width: 100px; height: 100px; border-radius: 50%; box-shadow: 15px 15px 0 snow; --delay: 0s; }
#mplayer::before, #mplayer::after { position: absolute; content: ''; width: 100px; height: 100px; background: url('https://638183.freep.cn/638183/t23/1/heart_133236768103332344.png') 0 0 no-repeat; cursor: pointer; animation: chgBg 1s steps(29,jump-none) infinite var(--delay) var(--state); }
#mplayer::after {--delay: .5s;bottom: -550px;left: 560px;}
@keyframes chgBg { to { background-position: 100%; } }
@keyframes cover1 { from { width: 0; } to { width: 100%; } }
@keyframes cover2 { from { width: 0; } to { width: 100%; } }
</style>
<div id="papa"><div id="lrc" data-lrc="HCPlayer">HCPlayer</div><div id="mplayer"></div><audio id="aud" src="https://music.163.com/song/media/outer/url?id=2029149160" autoplay loop></audio></div>
<script>
(function() {
let mKey = 0, mFlag = true;
let lrcTime = (ar) => {let tmpAr = [];for(j = 0; j <ar.length - 1; j ++) {if(j !== ar.length - 1) tmpAr = parseFloat((ar - ar).toFixed(1));}let aver = parseInt(tmpAr.reduce((a,b) => a + b) / (tmpAr.length - 1)) + averAdd;tmpAr.push(aver);tmpAr.forEach((item,key) => {ar = item > aver ? aver : item;});return ar;};
let averAdd = 0, offset = 0;
let getLrcAr = (text) => {let lrcAr = [];let calcRule = ;for(x of text.split('\n')) {let ar = [];let re = /\d+[\.:]\d+([\.:]\d+)?/g;let geci = x.replace(re,'');if(geci) {geci = geci.replace(/[\[\]\'\"\t,]s?/g,'');let time = x.match(re);if(time != null) {for(y of time) {let tmp = y.match(/\d+/g);let sec = 0;for(z in tmp) sec += tmp * calcRule;ar = ;lrcAr.push(ar); }}}}lrcAr.sort((a,b)=> a - b);return(lrcTime(lrcAr));}
let geci = `一颗狼星_许篮心 - 月落的声音（傈傈语版）\n原意:你看啊 月亮那么亮\n傈僳文:v bY bH lEH lEH m nu m: mo lA:\n拼音发音:nu nei la a ba za ali za li li(方言)\n你听呀 在唱歌的是谁家的姑娘\nn s mu: gw: m a: m ne bUH ny VA\nnu na la a sa za a mi mu gua gua (方言)\n你看啊 光照亮了远方\nmU: ko lo ko bA kL ni m s s R:\nnu nei la em ca za a li ba li li(方言)\n我还是想要你回到我的身旁\na du jia a ti pa de ni sa sa(方言)\na du jia a ti pa de ni sa sa(方言)\n潇潇落雨\nmL: v xu: xu:\nmu ha shu shu\n悄悄爱你\nnU tA dU: jw:\nnu de du jia\n是花开的声音\nsi we we sA bA jw:\nsi wei wei sei bei zhua\n悄悄想你是月落的声音\ndU: jw: m v bY kw bA Ju l ne\ndu zhua ma ha gua bei fu la ni\n舍不得放掉手里捏的那个名字\nVw ny nU tA a TA li mi le fi m: yA\nwo nie nu de ha ta li mi li zi ma yi\n却再也听不到独一无二的嗓音\nTi: Fi nU sA n n m: w m tA jo\nti ci nu sai na na ma wa ma de zhu\n鸟飞去雾里再也没有归期\nny R: byE lo yi ny l: l m: ku\nnie za beiu lu yi nie la la ma gu\n剩下另一只孤零零站在风里\nmi: vE ho: ho: kw Ti: m tA li: ny Pe\nmi hi hu hu gua ti ma dai li nie pi\n潇潇落雨\nmL: v xu: xu:\nmu ha shu shu\n悄悄哭泣\nmyH biY xu: xu:\nnie bi shu shu\n是花落的声音\nsi we ho: sA bA jw:\nsi wei hu se bei zhua\n悄悄抱紧是雪化的声音\nw: ji: sA m ny Vw sA m Vo\nwa ji se ma nie wua se ma wowo\n你看啊 月亮那么亮\nv bY bH lEH lEH m nu m: mo lA:\nnu nei la a ba za ali za li li(方言)\n你听呀 在唱歌的是谁家的姑娘\nn s mu: gw: m a: m ne bUH ny VA\nnu na la a sa za a mi mu gua gua (方言)\n你看啊 光照亮了远方\nmU: ko lo ko bA li ni m s s R:\nnu nei la em ca za a li ba li li(方言)\n我还是想要你回到我的身旁\na du jia a ti pa de ni sa sa(方言)\n潇潇落雨\nmL: v xu: xu:\nmu ha shu shu\n悄悄爱你\nnU tA si: jyH\nnu dei si jie\n是花开的声音\nsi we we sA bA jw:\nsi wei weu sai bei zhua\n悄悄想你是月落的声音\nw: ji: sA li bA jw: n Ci Vo m:\ndu zhe ka ha ba bei fu la ni\n潇潇落雨\nmL: v xu: xu:\nmu ha shu shu\n悄悄回忆\nnU tA j: mL\nnu dei jua mu(en)\n悄悄离开你\nnU tA v m ny\nnu dei ha ma nie\n是云消散于天空的沉寂\nmi wo mL: tiH lA: yi m o jo: Vo\nmi wu me di lei yi ma wo zhu won\n你看啊 蓝色星星铺满路上\nmi wo ko m RLH R: bH lEH lEH\nmi wu gu ma zi za ma li lv\n你听啊 风铃转动 着遥望\nmi: vi zL lL sA mL l m n n\nmi hi zi lu sai mu la ma na na\n你在哪 回忆中错过的时光\nnu a kw co lo yi vy nyi cw ny V\nnu a gua zhu lu yi hai ni zhua nie ai\n我愿把 一路沧桑原谅\nro: nyi: xU T: fo m tA mi le se\nema mi sha mie ma da mi li gu la\n你看啊 月亮那么亮\nv bY bH lEH lEH m nu m: mo lA:\nnu nei la a ba za ali za li li(方言)\n--终--`;
let lrcAr = getLrcAr(geci);
let showLrc = (time) => {let name = mFlag ? 'cover1' : 'cover2';lrc.innerHTML = lrcAr;lrc.dataset.lrc = lrcAr.replace(/<br>/, '\n');lrc.style.setProperty('--motion', name);lrc.style.setProperty('--tt', time + 's');papa.style.setProperty('--state', 'running');mKey += 1;mFlag = !mFlag;};
let calcKey = () => {for (j = 0; j < lrcAr.length; j++) {if (aud.currentTime <= lrcAr) {mKey = j - 1;break;}}if (mKey < 0) mKey = 0;if (mKey > lrcAr.length - 1) mKey = lrcAr.length - 1;let time = lrcAr - (aud.currentTime - lrcAr);showLrc(time);};
let toMin = (val) => {if (!val) return '00:00';val = Math.floor(val);let min = parseInt(val / 60),sec = parseFloat(val % 60);if (min < 10) min = '0' + min;if (sec < 10) sec = '0' + sec;return min + ':' + sec;}
let mState = () => papa.style.setProperty('--state', aud.paused ? 'paused' : 'running');
aud.addEventListener('pause', () => mState());
aud.addEventListener('play', () => mState());
aud.addEventListener('seeked', () => calcKey());
aud.addEventListener('timeupdate', () => {for (j = 0; j < lrcAr.length; j++) {if (aud.currentTime >= lrcAr) {if (mKey === j) showLrc(lrcAr);else continue;}}});
mplayer.addEventListener('click', () => aud.paused ? aud.play() : aud.pause());
})();
</script>
普通话版月落的声音：
https://www.huachaowang.com/forum.php?mod=viewthread&tid=64363&highlight=%D4%C2%C2%E4%B5%C4%C9%F9%D2%F4 按钮相关联上面的小红心{:4_199:} 小辣椒 发表于 2023-3-20 20:29
按钮相关联上面的小红心
上下都关联 马黑黑 发表于 2023-3-20 20:29
上下都关联
看见了，黑黑好制作{:4_178:} 还有钱{:4_170:} 小辣椒 发表于 2023-3-20 20:30
看见了，黑黑好制作
这个随手拈来 赶快回帖，钱在招手 黑黑最无私，分享还有送钱 小辣椒 发表于 2023-3-20 20:31
赶快回帖，钱在招手
有钱钱吗，我都忘记有这个操作了{:4_170:} 还送这么多 小辣椒 发表于 2023-3-20 20:31
黑黑最无私，分享还有送钱
倒贴是幸福的{:4_205:} 马黑黑 发表于 2023-3-20 20:31
这个随手拈来
你手特别巧 没有钱钱了{:4_170:} 马黑黑 发表于 2023-3-20 20:32
倒贴是幸福的
境界高的 小辣椒 发表于 2023-3-20 20:33
境界高的
三班三班 马黑黑 发表于 2023-3-20 20:32
有钱钱吗，我都忘记有这个操作了
哈哈~~~不会错发了啊 小辣椒 发表于 2023-3-20 20:33
没有钱钱了
银行都关门了 小辣椒 发表于 2023-3-20 20:34
哈哈~~~不会错发了啊
怎么会？习惯性动作，自己一下子没有留意{:4_170:} 马黑黑 发表于 2023-3-20 20:34
银行都关门了
别混为一谈{:4_397:}