同步歌词（十一）手动显示多行歌词无规则移动

海特行者

[i=s] 本帖最后由 海特行者 于 2022-10-14 14:37 编辑 [/i]

同步歌词播放器 （十一）手动显示多行歌词无规则移动

 

    图片播放代码：

＜embed height="520" src="http://image.hnol.net/c/swf/2021-08/01/16/2021080116592341-5769293.swf?auto=1&wait=0&img1=http://www.keai99.com/data/attachment/forum/202109/23/131415tp8p8aizn66rgyap.jpg&img2=http://www.keai99.com/data/attachment/forum/202109/23/131441nuln4l4uupw9ulpo.jpg&img3=http://www.keai99.com/data/attachment/forum/202109/23/131509sx9oiodbpaiapo8c.jpg&img4=http://www.keai99.com/data/attachment/forum/202109/23/131525cvs6ub6s446b6v2s.jpg&&test=1&" style="filter:contrast(100%)brightness(100%);position: relative;top:-20px;LEFT: 0px;" type="application/x-shockwave-flash" width="700" wmode="transparent"＞＜/embed＞

    同步歌词代码：

＜style type="text/css"＞#和平鸽{
animation: animTrans 15s linear infinite; /*linear匀速变换 infinite无限循环*/ }
@keyframes animTrans {
0% {transform: scale(0.6) translate(-500px, 450px);}/*歌词缩放 位移*/
50% {transform: scale(1.0) translate(-700px, 400px);}
100% {transform: scale(0.5) translate(-500px, 500px);font-style: oblique;}}
＜/style＞
＜div id="和平鸽" style="width:30%;height:500px;position:absolute;right:20px; top:2230px;"＞＜img src="http://www.keai99.com/data/attachment/forum/202109/26/175522a8dalr7z8krzvr98.gif" style="width:100px; height:100px; overflow:hidden; border-radius:50%;"＞
＜script type="text/javascript"＞!window.procLRC & document.write('＜script type="text/javascript" src="http://cesholl.cn3v.net/scripts/processLRC.min.js" charset="utf-8"＞＜\/script＞');＜/script＞
＜textarea id="lrc_content" style="visibility:hidden;"＞
[00:00.00]《我还在这里等你》（同步歌词略去）
＜/textarea＞ ＜script type="text/javascript"＞var opts = {
lrcTxtID:'lrc_content',
lrcShowID:"和平鸽",
audioURL:"http://url.amp3a.com/kuwo.php/145095099.mp3",
gczh:'1.5em',/*字大小*/
gczt:'微软雅黑',/*字体*/
gcct:'true',/*笔划加粗（与gcct=1同）*/
dqfs:'center',/*横式排列歌词时居中对齐*/
gcys:'#00F',/*在唱字色*/
gcys1:'red',/*字颜色*/
playLoop:'true',/*循环播放*/
showMode:'1',/*0值歌词横行排列，1值歌词纵行排列*/
gchs:4/*歌词行数*/}
setTimeout(function(){procLRC(opts);},);
＜/script＞

    代码解析：

    绿色代码......播放图片代码。

    红色代码......播放钮代码。

    橙色代码......同步歌词代码。

    scale......缩放。

    oblique......文字倾斜。

点击下图中的和平鸽，歌声响起

 

[00:00.00]《我还在这里等你》 [00:07.03]演唱：流苏 [00:14.26]词：燕无语 [00:21.80]曲：轻云望月 [00:27.86]灰色的天空 [00:32.97]下起了心酸的雨 [00:36.96]雨滴敲醒了回忆 [00:40.77]记忆里无法删除你 [00:45.44]无眠的夜里 [00:49.37]数着星星想着你 [00:53.57]明知道遥不可及 [00:57.31]心的翅膀依然飞起 [01:02.00]我还在这里等你 [01:06.95]你是否记得这里 [01:11.31]人生本来就是一场戏 [01:15.54]曲终人散后是怅然的思绪 [01:24.01]我还在这里等你 [01:27.85]你却早忘了这里 [01:32.26]我依然微笑着努力寻找 [01:36.57]一个不可能再次出现的你 [02:05.62]无眠的夜里 [02:09.77]数着星星想着你 [02:13.98]明知道遥不可及 [02:17.92]心的翅膀依然飞起 [02:22.23]我还在这里等你 [02:26.44]你是否记得这里 [02:30.77]人生本来就是一场戏 [02:34.95]曲终人散后是怅然的思绪 [02:43.34]我还在这里等你 [02:47.31]你却早忘了这里 [02:51.75]我依然微笑着努力寻找 [02:55.80]一个不可能再次出现的你 [03:04.29]我还在这里等你 [03:08.29]你是否记得这里 [03:12.49]人生本来就是一场戏 [03:16.80]曲终人散后是怅然的思绪 [03:25.03]我还在这里等你 [03:29.05]你却早忘了这里 [03:33.49]我依然微笑着努力寻找 [03:37.65]一个不可能再次出现的你 [03:46.11]一个不可能再次出现的你 [03:58.81]

静悟

欣赏学习老师的同步歌词（十一）手动显示多行歌词无规则移动 ！下面的图片没看到。

海特行者

静悟 发表于 2021-9-28 09:21
欣赏学习老师的同步歌词（十一）手动显示多行歌词无规则移动 ！下面的图片没看到。

下面有图的请见“同步歌词（五）”，本帖与“同步歌词（五）”不同，网址不一样，遮盖模式也不一样。现图代码也不一样。

静悟

海特行者 发表于 2021-9-30 11:41
下面有图的请见“同步歌词（五）”，本帖与“同步歌词（五）”不同，网址不一样，遮盖模式也不一样。现图 ...

看到了。漂亮的移动歌词。学习了！

真真

谢谢老师带来美好！欣赏来迟，向老师问好！