《素颜》- 许嵩 / 何曼婷
本帖最后由 加林森 于 2022-8-1 17:04 编辑 <br /><br /><style>.papa { left: -214px;width: 1024px; height: 535px; background: rgba(0,0,0,.4) url('https://s1.ax1x.com/2022/08/01/vAK64H.jpg'); position: relative; }
.papa input { border: none; outline: none; opacity: .75; cursor: pointer; }
.papa p { margin: 0; padding: 0; }
.playbox { position: relative; left: 10px; top: 10px; padding: 10px; width: fit-content; font: normal 1em sans-serif; color: snow; background: rgba(255,255,255,.25); backdrop-filter: blur(2px); border-radius: 8px; overflow: hidden; box-shadow: 1px 2px 2px #000; }
#btnplay { width: 30px; height: 30px; border-radius: 50%; }
#btnplay:hover { background: #aaa; color: #ff0000; }
</style>
<div class="papa">
<div class="playbox">
<p id="geci">LRC Loading ... </p>
<p style="display: flex; align-items: center; gap: 4px; margin-top: 10px;">
<input id="btnplay" type="button" value=">" />
<input id="slider" type="range" min="0" max="100" value="0" />
<span id="per">0:0 | 0:0</span>
</p>
</div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=167827.mp3" autoplay="autoplay" loop="loop"></audio>
</div>
<script>
let slider = document.querySelector('#slider'),
aud = document.querySelector('#aud'),
per = document.querySelector('#per'),
btnplay = document.querySelector('#btnplay'),
geci = document.querySelector('#geci');
let slip = 0; //误差值
let lrcAr = [
['0.06','曲名：素颜'],
['120.51','歌手：许嵩 / 何曼婷 '],
['160.51','所属专辑：素颜'],
['220.00','谢谢欣赏'],
];
slider.onmousedown = () => aud.pause();
slider.onchange = () => { aud.currentTime = slider.value * aud.duration / 100; aud.play(); }
btnplay.onclick = () => aud.paused ? aud.play() : aud.pause();
aud.addEventListener('playing', () => btnplay.value = '||');
aud.addEventListener('pause', () => btnplay.value = '>');
aud.addEventListener('timeupdate', () => {
let prog = 100 * aud.currentTime / aud.duration;
slider.value = prog;
per.innerText = toMin(aud.currentTime) + ' | ' + toMin(aud.duration);
for(j=0; j<lrcAr.length; j++){
if(aud.currentTime >= lrcAr - slip){
geci.innerHTML = lrcAr;
}
}
});
let toMin = (sec) => {
if(!sec) return '0:00';
sec = parseInt(sec);
return parseInt(sec / 60) + ':' +parseFloat(sec % 60).toString().padStart(2,'0');
}
</script>
本帖最后由 加林森 于 2022-8-1 12:05 编辑
素颜-许嵩 / 何曼婷
作词 : 许嵩
作曲 : 许嵩
编曲 : 夏侯哲
又是一个安静的晚上
一个人窝在摇椅里乘凉
我承认这样真的很安详
和楼下老爷爷一样
听说你还在搞什么原创
搞来搞去好像也就这样
不如花点时间想想
琢磨一下模样
今夜化了美美的妆
(我相信是很美美的装)
我摇晃在舞池中央
(那种体态可以想象)
我做我的改变 又何必纠结
那就拜托别和我碰面
如果再看你一眼
是否还会有感觉
当年素面朝天要多纯洁就有多纯洁
不画扮熟的眼线
不用抹匀粉底液
暴雨天 照逛街
偷笑别人花了脸
如果再看你一眼
是否还会有感觉
最真实的喜怒哀乐全都埋葬在昨天
不掺任何的表演
轰轰烈烈那几年
我怀念 别怀念
怀念也回不到从前
又是一个安静的晚上
一个人窝在摇椅里乘凉
我承认这样真的很安详
和楼下老爷爷一样
听说你还在搞什么原创
搞来搞去好像也就这样
不如花点时间想想
琢磨一下模样
今夜化了美美的妆
(我相信是很美美的装)
我摇晃在舞池中央
(那种体态可以想象)
我做我的改变 又何必纠结
那就拜托别和我碰面
如果再看你一眼
是否还会有感觉
当年素面朝天要多纯洁就有多纯洁
不画扮熟的眼线
不用抹匀粉底液
暴雨天 照逛街
偷笑别人花了脸
如果再看你一眼
是否还会有感觉
最真实的喜怒哀乐全都埋葬在昨天
不掺任何的表演
轰轰烈烈那几年
我怀念 别怀念
怀念也回不到从前
曾经对上的瞬间
难道是一种错觉
那些流逝了的就永远不会复现
不掺任何的表演
轰轰烈烈那几年
有遗憾的感觉 为何感觉
那消失不见的素颜
好制作。图片文本醒目，但图片像素偏低，不要压缩太厉害 听歌欣赏队长好制作{:4_187:} 马黑黑 发表于 2022-8-1 12:38
好制作。图片文本醒目，但图片像素偏低，不要压缩太厉害
嗯嗯，我去修改。 红影 发表于 2022-8-1 13:04
听歌欣赏队长好制作
谢谢红影！下午好。 马黑黑 发表于 2022-8-1 12:38
好制作。图片文本醒目，但图片像素偏低，不要压缩太厉害
现在修改了，你再来看看。 加林森 发表于 2022-8-1 13:12
谢谢红影！下午好。
这图片的颜色又是有点怪呢{:4_173:} 红影 发表于 2022-8-1 16:30
这图片的颜色又是有点怪呢
怎么怪啦？ 黑白大片！{:5_116:} 东篱闲人 发表于 2022-8-1 17:33
黑白大片！
行不行呢？ 加林森 发表于 2022-8-1 17:39
行不行呢？
漂亮！{:5_116:} 东篱闲人 发表于 2022-8-1 17:43
漂亮！
那就放心了。谢谢老兄支持！{:5_116:} 加林森 发表于 2022-8-1 13:11
嗯嗯，我去修改。
变黑白了 马黑黑 发表于 2022-8-1 18:22
变黑白了
是啊 ，来过全素的 。 加林森 发表于 2022-8-1 18:39
是啊 ，来过全素的 。
有特色 马黑黑 发表于 2022-8-1 19:12
有特色
是的。 加林森 发表于 2022-8-1 16:33
怎么怪啦？
哦，现在成黑白的{:4_173:} 红影 发表于 2022-8-1 21:52
哦，现在成黑白的
全素了 这个也是一图 一歌曲？
页:
[1]
2