《像风一样》- 薛之谦
本帖最后由 加林森 于 2022-8-2 21:16 编辑 <br /><br /><style>.papa { left: -214px;width: 1024px; height: 640px; background: rgba(0,0,0,.4) url('https://s1.ax1x.com/2022/08/02/vVAqiR.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=516657051.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','所属专辑：渡'],
['240.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-2 10:23 编辑
《像风一样》- 薛之谦
我等的模样好不具象
用皮肤感受你的流向
你竟然能做到带走阳光
我一味的跟随过了量
像风一样
你靠近云都下降
你卷起千层海浪我躲也不躲往里闯
你不就像风一样
侵略时沙沙作响
再宣布恢复晴朗就好像我们两个没爱过一样
曲折的夕阳负责格挡
让委屈的感官无法释放
最近我的伤口没生长
因为我躲在没风的地方
像风一样
你靠近云都下降
你卷起千层海浪我躲也不躲往里闯
你不就像风一样
侵略时沙沙作响
再宣布恢复晴朗就好像我们两个没爱过一样
你像风一样
触摸时温柔流淌
席卷我所有抵抗不急着要我投降
你不就像风一样
掠夺时沙沙作响
可惜我自投罗网你也就没什么可骄傲的地方
和风一样
你离开不声不响
我喜欢这种收场看上去谁也不曾亏欠过对方
队长高产。
提个建议：菇凉图图一定要高清的，最好蓝光{:5_109:} 马黑黑 发表于 2022-8-2 12:34
队长高产。
提个建议：菇凉图图一定要高清的，最好蓝光
好的好的。我去修改。 加林森 发表于 2022-8-2 12:43
好的好的。我去修改。
不必修改，下回弄高清的就行 马黑黑 发表于 2022-8-2 12:59
不必修改，下回弄高清的就行
这次换了一张高清的了。你再来看看。 过往像风一样，不留痕迹。欣赏队长好帖{:4_187:} 加林森 发表于 2022-8-2 13:09
这次换了一张高清的了。你再来看看。
这个换上去的明显不是高清，比原来的还差 红影 发表于 2022-8-2 13:31
过往像风一样，不留痕迹。欣赏队长好帖
红影来啦。下午好！ 马黑黑 发表于 2022-8-2 13:32
这个换上去的明显不是高清，比原来的还差
啊？我再去找。 加林森 发表于 2022-8-2 13:37
啊？我再去找。
你看菇凉的脸，都长苔藓了 马黑黑 发表于 2022-8-2 17:12
你看菇凉的脸，都长苔藓了
就你想得太多了。{:4_172:} 加林森 发表于 2022-8-2 17:45
就你想得太多了。
可我没说假话 马黑黑 发表于 2022-8-2 17:54
可我没说假话
知道知道。{:5_108:} 加林森 发表于 2022-8-2 18:07
知道知道。
我感觉你不知道 马黑黑 发表于 2022-8-2 18:36
我感觉你不知道
我一下就去换图片。重新制作一个出来。 加林森 发表于 2022-8-2 18:49
我一下就去换图片。重新制作一个出来。
不急慢慢来 马黑黑 发表于 2022-8-2 19:57
不急慢慢来
老黑请再来看看，这个效果怎么样？ 队长主要找图的方法还是不清楚。。。。找的图本来就不是高清，像素低的图不要用
再提醒一下-----百度----找你需要的图图名称--比如大海---记住打上壁纸2个字---搜索的名称---大海壁纸 小辣椒 发表于 2022-8-2 20:44
队长主要找图的方法还是不清楚。。。。找的图本来就不是高清，像素低的图不要用
再提醒一下-----百度--- ...
好的，记住了。谢谢小辣椒！{:4_190:}
页:
[1]
2