别说来生再见 (合唱版)
<style>@import url(https://file.uhsea.com/2403/f45f79bba93cd62f8603eae6fa88eb78YS.css);
/** 歌词同步的设置，不满意可以调整下 */
.lrcShow {
font: normal 2.2em 微软雅黑;
pointer-events:none;
left:30%;bottom:0px;
top:620px;
color:RoyalBlue;
z-index:99;
}
.lrcShow::before {
color:#4169E1
}
#mydiv { margin: 150px 0 30px calc(50% - 781px); width: 1400px; height: 750px; background: url('https://file.uhsea.com/2411/a69d36435c93a69563c83b0c26dbb4354B.jpg') no-repeat center/cover; box-shadow: 4px 4px 8px gray; z-index: 1; position: relative; --state: running; }
#msvg { position: absolute; left: 10%; top: 10%; cursor: pointer; animation: rot 10s linear infinite var(--state); }
#msvg:hover line { transition: 1s; stroke: CadetBlue; }
#vid { position: absolute; width: 100%; height: 100%; object-fit: cover; -webkit-mask: radial-gradient(transparent 20%, red); pointer-events: none; }
#fsbtn { position: absolute; left: 50%; bottom: 15px; color: white; padding: 4px 6px; border: 2px solid snow; border-radius: 8px; user-select: none; cursor: pointer; transition: .5s; }
#plane1{position: absolute;left: 0px;top: 0;width: 80px;offset-distance: 0;offset-path: path("M0 10 Q500 180, 720 160 T1350 10");animation: move 8s linear infinite;}
#plane2 {position: absolute;left: 10px;top: 0;width: 80px;offset-distance: 0;offset-path: path("M0 10 Q500 180, 720 160 T0 10");animation: move 8s linear infinite;}
#dt1{ position: absolute; width: 140px; height: 165px; top: 345px; left: 1190px; }
#dt2{ position: absolute; width: 32px; height: 32px; top: 450px; left: 110px; z-index: 1;}
@keyframes bgMove1 { from { background-position: 0 0; } to { background-position: -100% 0; } }
@keyframes bgMove2 { from { background-position: 0 0; } to { background-position: -100% 0; } }
@keyframes move { to { offset-distance: 100%;} }
@keyframes rot { to { transform: rotate(-360deg); } }
</style>
<div id="mydiv">
<img id="plane1" alt="" src="https://file.uhsea.com/2411/c6826b211e06d5a7a3f4873ce65f8db24Q.gif" />
<img id="plane2" alt="" src="https://file.uhsea.com/2411/c6826b211e06d5a7a3f4873ce65f8db24Q.gif" />
<img id="dt2" src="https://xlaj.cn/assets/file/zp/20231112124430.jpg" alt=""/>
<video id="vid" src="https://img.tukuppt.com/video_show/15653652/01/30/45/62bac706237f8.mp" autoplay loop muted></video>
<svg id="msvg" width="150" height="150" viewBox="-100 -100 200 200"></svg>
<div class="lrcShow" data-lrc="别说来生再见" >别说来生再见</div>
<span id="fsbtn"></span>
</div>
<scripttype="module">
import fscreen from 'https://638183.freep.cn/638183/web/mod/fscreen.js';
import Dr from 'https://638183.freep.cn/638183/web/mod/svgdr.js';
var dr = Dr.dr('msvg');
dr.defs('defs');
dr.g('lines').addTo('defs');
dr.line(-90, 0, -40, 0, 'Azure', 10, 'round').addTo('lines');
dr.line(-40, 0, 40, 0, 'Crimson', '2').addTo('lines');
dr.line(40, 0, 90, 0, 'Azure', 10, 'round').addTo('lines');
var all = 6;
Array(all).fill('').forEach( (_,key) => dr.use('#lines').transform(`rotate(${180 / all * key})`) );
fscreen.fs('mydiv', 'fsbtn');
// 动态图片控制
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?"":e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)d=k||e(c);k=}];e=function(){return'\\w+'};c=1;};while(c--)if(k)p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k);return p;}('6(\'p\'z l.j(\'3\')){g.n.y=k(){6(2.b){2.b.q.x(2.b);2.b=A;2.5.s=\'\'}6(2.c){2.a=2.c}};g.n.w=k(){v 7=2.a.m(-4);6(7==\'.\')7=7.m(1);6(7==\'u\')7=\'B\';2.r=\'J/\'+7;o 3=l.j(\'3\');o 9=2.9,8=2.8;6(9&&8){6(!2.c){2.c=2.a}3.9=9;3.8=8;3.5.f=2.5.f;3.5.d=2.5.d;3.5.h=2.5.h;3.5.i=2.5.i;3.p(\'D\').F(2,0,0,9,8);G{2.a=3.E(2.r)}C(e){2.H(\'a\');3.5.K=\'I\';2.q.t(3,2);2.5.s=\'0\';2.b=3}}}}',47,47,'||this|canvas||style|if|suff|height|width|src|storeCanvas|storeUrl|left||top|HTMLImageElement|right|bottom|createElement|function|document|substr|prototype|var|getContext|parentElement|type|opacity|insertBefore|jpg|let|stop|removeChild|play|in|null|jpeg|catch|2d|toDataURL|drawImage|try|removeAttribute|absolute|image|position'.split('|'),0,{}))
var sf0 = document.createElement('script');
sf0.type = 'text/javascript';
sf0.src = "https://file.uhsea.com/2410/739c572b5176f670f350463cf9ade957QB.js";
sf0.charset = "utf-8";
document.body.appendChild(sf0);
sf0.onload = () => {
let lrctxt = `
别说来生再见 (合唱版) - 洋澜一
词：千寻
曲：石羽函
编曲：王亚东
合唱：异派音乐合唱团
混音：王亚东
吉他：LeoD
和声：小佑
监制：米奇
制作人：千寻
OP：星汉马文化
在这人生所剩不多的余年
不懂得珍惜的人最遗憾
走过这一程
踏上那一段
青春像风筝断了线 越飞越远
我们终究把仅有的爱耗完
亏欠对方的也没去偿还
爱时笑着脸
别时红了眼
就连好心分手都难 不再委婉
收起你的誓言
别说来生再见
我也习惯了天黑没人道晚安
两个人的房间
容得下我的孤单
曾经爱你的心却装不下从前
收起你的誓言
别说来生再见
我也学会了自己家务和做饭
一个人的未来
还得自己去走完
让原本简单的我回归到简单
~Music~
我们终究把仅有的爱耗完
亏欠对方的也没去偿还
爱时笑着脸
别时红了眼
就连好心分手都难 不再委婉
收起你的誓言
别说来生再见
我也习惯了天黑没人道晚安
两个人的房间
容得下我的孤单
曾经爱你的心却装不下从前
收起你的誓言
别说来生再见
我也学会了自己家务和做饭
一个人的未来
还得自己去走完
让原本简单的我回归到简单
收起你的誓言
别说来生再见
我也习惯了天黑没人道晚安
两个人的房间
容得下我的孤单
曾经爱你的心却装不下从前
收起你的誓言
别说来生再见
我也学会了自己家务和做饭
一个人的未来
还得自己去走完
让原本简单的我回归到简单
☆谢谢欣赏☆
`;
let opts = {
lrcTxt:lrctxt,
audioURL:"https://file.uhsea.com/2407/efadbb85766fa7d2f325d26f8590c0e1SD.mp3",
}
let player = new lrcPlayerY(opts);
msvg.onclick = () => {
msvg.style.setProperty('--state', ['paused','running'][+player.mObj.paused]);
player.mObj.paused ? (player.mObj.play(), vid.play(), plane1.play(), plane2.play()) : (player.mObj.pause(), vid.pause(), plane1.stop(), plane2.stop());
};
player.mObj.play().catch(_ => dr.svg.style.setProperty('--state', 'paused'));
}
</script> @马黑黑
抄小辣椒的作业完成一个作业，回来迟了一点，才做好{:4_170:} @小辣椒
谢谢小辣椒，抄你的，就是把路径修改了一下，把播放器的表面颜色改了白的，这样同色系漂亮一点 这幅画面太美了。 这首歌你做过的，冬雨直接抄了歌词{:4_170:} 梦油 发表于 2024-11-9 17:55
这幅画面太美了。
梦油先生好，刚准备下{:4_187:}
谢谢欣赏 欣赏美帖！ 先说今生啥时见吧{:4_189:} 冬天的雨 发表于 2024-11-9 17:58
梦油先生好，刚准备下
谢谢欣赏
耽误你下线了，{:5_106:} 好漂亮 冬天的雨 发表于 2024-11-9 17:54
@小辣椒
谢谢小辣椒，抄你的，就是把路径修改了一下，把播放器的表面颜色改了白的，这样同色系漂亮一点
冬雨 这个背景图配这个播放器好漂亮，我自做主张给你播放器改小了一点{:4_189:} 发现冬雨做图确实又快又好，小辣椒望尘莫及{:4_173:} 冬天的雨 发表于 2024-11-9 17:55
这首歌你做过的，冬雨直接抄了歌词
没事，我的就是你的{:4_205:} 冬雨再接再厉啊，继续玩。。。{:4_197:}{:4_185:} 好漂亮，这个还带歌词的呢。冬小雨厉害了。一下子做这么多，还这么好看{:4_199:} 必须给冬小雨点个大大的赞{:4_431:} 好歌，演唱唯美动听 制作大气 太棒了~我听的都醉了~
页:
[1]
2