《错位时空》-艾辰 送大家！
本帖最后由 加林森 于 2022-3-1 17:48 编辑 <br /><br /><style type="text/css">.mnBox { position: relative; margin: 0 auto; padding: 35px; width: 660px; border: none; border-top: 6px solid #008B8B; border-radius: 10px; background: #ADD8E6; }
.ctBox { margin: 0; padding: 30px; background: #fff; min-height: 300px; border-radius: 10px; }
.ctBox p,img, h2,button { text-align:center; }
#lrcDiv { margin: auto; width: 300px; height: 43px; overflow: hidden; position: relative; padding: 8px; text-align:center; }
#lrcDiv ul, lrcli { margin: 0; padding: 0;}
#lrcUl { position: absolute; left:30px;top: 0; }
#lrcUl li { height: 20px; font-size:14px; line-height:20px;left:50px; color: black; list-style-type: none; }
#myplayer { outline: none; list-style-type: none; }
</style>
<div class="mnBox">
<div class="ctBox">
<p style="text-align:center;"><img alt="420" height="300" src="https://pic.imgdb.cn/item/621c4d092ab3f51d91ffe044.jpg" /><br></p>
<h2 style="padding-bottom: 10px;">错位时空-艾辰</h2>
<h2 style="text-align:center;">送大家</h2>
<pre>
《错位时空》信息介绍
出品：网易云音乐飓风工作室
OP：腾煌星象
分轨混音：Mr.鱼
制作人：艾辰。
贝斯：谭玮
吉他：望雷
监制/统筹：孙斌@子文沐凡
贴唱/和声：沙栩帆
企划：丁柏昕/袁晓童
成熟的感觉是忧伤的，
宣发：徐思灵
出品人：谢奇笛/凌联兴
</pre>
<p style="margin: auto; width:120px; left:50px;text-align:center; font-size:14px; color:#000;"><marqueescrollamount="2" direction="left" >错位时空-艾辰</marquee></p>
<p style="text-align:center;"><audio id="myplayer" src="http://www.kumeiwp.com/sub/filestores/2021/01/26/3257549a45c411cb86e2472da1afa6d8.mp3" controls="controls" autoplay="autoplay"></audio></p>
<div id="lrcDiv"><ul id="lrcUl"></ul></div>
<p style="margin: 20px; text-align:center;">加林森2022 02 28</p>
</div>
</div>
<p style="margin: auto; width:420px; left:50px;text-align:center; font-size:14px; color:#000;">
<script language="javascript">
var lrcAr = [
["00:01.70","错位时空-艾辰"],
["00:05.24","填词：周仁 谱曲：张博文"],
["00:07.38","编曲：陈林"],
["00:15.59","填不满半排观众的电影"],
["00:20.95","直到散场时突然亮起灯"],
["00:23.17","字幕定格在某某出品和发行"],
["00:26.41","我目送 他们行色匆匆"],
["00:30.28","像个自不量力的复读生"],
["00:33.72","完不成金榜题名的使命"],
["00:37.53","命不是猜剪刀石头布的决定"],
["00:41.27","那么任性"],
["00:45.24","我吹过你吹过的晚风"],
["00:48.26","那我们算不算 相拥"],
["00:51.76","可如梦初醒般的两手空空"],
["00:55.51","心也空"],
["00:59.43","我吹过你吹过的晚风"],
["01:02.82","是否看过同样 风景"],
["01:06.15","像扰乱时差留在错位时空"],
["01:09.89","终是空 是空"],
["01:31.02","数不完见证许愿的繁星"],
["01:34.78","没灵验谁来安慰坏心情"],
["01:38.31","十字路口闪烁不停的信号灯"],
["01:41.72","有个人 显然心事重重"],
["01:45.28","三个字 只能说给自己听"],
["01:48.69","仰着头不要让眼泪失控"],
["01:52.55","哪里有可以峰回路转的宿命"],
["01:56.37","我不想听"],
["02:00.66","我吹过你吹过的晚风"],
["02:04.97","那我们算不算 相拥"],
["02:07.16","可如梦初醒般的两手空空"],
["02:10.66","心也空"],
["02:13.86","我吹过你吹过的晚风"],
["02:17.83","是否看过同样 风景"],
["02:21.42","像扰乱时差留在错位时空"],
["02:24.98","终是空 是空"],
["02:32.69","我吹过你吹过的晚风"],
["02:35.88","空气里弥漫着 心痛"],
["02:39.36","可我们 最后 在这错位时空"],
["02:42.80","终成空"],
["02:46.90","我吹过你吹过的晚风"],
["02:50.01","空气里弥漫着 心痛"],
["02:53.63","可我们 最后 在这错位时空"],
["02:57.50","终成空 成空"],
["03:15.17","谢谢欣赏"]
];
var myaud = document.getElementById('myplayer'); //播放器标识
var lrcUl = document.getElementById('lrcUl'); //歌词显示元素标识
//处理lrc歌词数组：时间转换成秒、歌词放入li标签
for(j=0; j<lrcAr.length; j++){
lrcAr = toSec(lrcAr);
lrcUl.innerHTML += "<li id='li" + lrcAr + "'>" + lrcAr + "</li>";
}
//lrc时间信息转为秒
function toSec(lrcTime) {
let tmpAr = lrcTime.split(':');
lrcTime = tmpAr * 60 + parseInt(tmpAr);
return lrcTime;
}
//同步高亮、翻滚歌词
myaud.ontimeupdate = function() {
let tt = this.currentTime;
for(j=0; j<lrcAr.length; j++){
if(tt > lrcAr){
if(j > 0){
let idxLast = lrcAr;
document.getElementById("li" + idxLast).style.color = "black";
lrcUl.style.top ="-" + (j * 20 - 20) + "px";
}
let idx = lrcAr;
document.getElementById("li" + idx).style.color = "red";
}
}
}
// 播放结束重置歌词样式
myaud.onended = function() {
document.getElementById("li" + lrcAr).style.color = "black";
lrcUl.style.top = 0;
this.play();
}
</script> 这个我也做过的。队长做得好看。图片貌似又是有变形{:4_187:} 红影 发表于 2022-2-28 16:46
这个我也做过的。队长做得好看。图片貌似又是有变形
红影下午好。你制作过的啊，在哪里?{:4_187:} 加林森 发表于 2022-2-28 16:57
红影下午好。你制作过的啊，在哪里?
《错位时空》（学习歌词同步制作）
https://www.huachaowang.com/forum.php?mod=viewthread&tid=57103&fromuid=2
(出处: 花潮论坛)
队长第一个回帖的，不记得了？{:4_173:} 红影 发表于 2022-2-28 19:13
《错位时空》（学习歌词同步制作）
https://www.huachaowang.com/forum.php?mod=viewthread&tid=57103&f ...
我去看看，我现在忘性比较大。{:4_189:} 红影 发表于 2022-2-28 19:13
《错位时空》（学习歌词同步制作）
https://www.huachaowang.com/forum.php?mod=viewthread&tid=57103&f ...
你制作得真漂亮，我们不一样的制作都是一首歌曲。{:4_189:} 队长现在歌词同步已经会编辑了，后面可以自己学习修改边框颜色，图图什么颜色，边框就修改什么颜色，增加欣赏度，更加漂亮的{:4_178:} 小辣椒 发表于 2022-2-28 20:35
队长现在歌词同步已经会编辑了，后面可以自己学习修改边框颜色，图图什么颜色，边框就修改什么颜色，增加欣 ...
好的好的。 加林森 发表于 2022-2-28 19:23
你制作得真漂亮，我们不一样的制作都是一首歌曲。
是的，做法不一样，却选了同一首歌{:4_173:} 红影 发表于 2022-2-28 20:52
是的，做法不一样，却选了同一首歌
是啊，这就是感觉都一样的。{:4_189:} 看着你们个个都会了，真不简单。{:4_199:} 樵歌 发表于 2022-2-28 21:01
看着你们个个都会了，真不简单。
樵歌也来玩玩啊。 加林森 发表于 2022-2-28 20:53
是啊，这就是感觉都一样的。
这首歌还是挺好听的。 红影 发表于 2022-2-28 21:17
这首歌还是挺好听的。
就是，红影，我把几个帖的边框的颜色都改了。你看看去。 加林森 发表于 2022-2-28 21:03
樵歌也来玩玩啊。
我可能不行的，不能在坐信了，每天早中晚最多各上半小时。 樵歌 发表于 2022-2-28 21:26
我可能不行的，不能在坐信了，每天早中晚最多各上半小时。
等你好了再玩。不急的。{:4_176:} 加林森 发表于 2022-2-28 21:22
就是，红影，我把几个帖的边框的颜色都改了。你看看去。
嗯嗯，改成自己喜欢的，会更好。 红影 发表于 2022-2-28 21:30
嗯嗯，改成自己喜欢的，会更好。
与图片相近就行了。 加林森 发表于 2022-2-28 21:31
与图片相近就行了。
你这个边框颜色太亮了点，喧宾夺主了。 红影 发表于 2022-3-1 11:52
你这个边框颜色太亮了点，喧宾夺主了。
等会去修改
页:
[1]
2