一世漂泊一世空
本帖最后由 醉美水芙蓉 于 2024-11-14 22:46 编辑 <br /><br /> <style>#papa { --width: 1300px; margin: 30px 0 30px calc(50% - (var(--width) / 2 + 81px)); width: var(--width); height: 720px; background: url('https://img-baofun.zhhainiao.com/pcwallpaper_ugc/scene/cabf7640e7a110cb55098b9f83e7fa74_preview.jpg') no-repeat center/cover; z-index: 1; overflow: hidden; box-shadow: 3px 3px 8px #666; position: relative; }
#Player { position: absolute; cursor: pointer; transition: 1.2s; animation: rot 8s linear infinite var(--state); z-index:10;}
#Player:nth-of-type(1) { width: 150px; height:199px; right: 100px;bottom: 30px; --deg: 1turn; }
#Player:hover { filter: hue-rotate(60deg) drop-shadow(0 0 28px #000); --state: paused; }
@keyframes rot { to { transform: rotate(var(--deg)); } }
.dancer { position: absolute; cursor: pointer;z-index:1;}
.lrcShow{font:normal 32px sans-serif;position:absolute;bottom:50px;left:30%;color:transparent;filter:drop-shadow(1px 1px 1px white);letter-spacing:2px;--aniName:bgMove1;--durTime:100ms;--aniPlayState:running;cursor:pointer;z-index:999;}
.lrcShow::before{position:absolute;content:attr(data-lrc);width:0;height:100%;left:0;top:0;color:transparent;color:Lime;background-image:linear-gradient(60deg,hsl(0,100%,50%),hsl(60,100%,50%),hsl(120,100%,50%),hsl(180,100%,50%),hsl(240,100%,90%));-webkit-background-clip:text;overflow:hidden;white-space:nowrap;animation:var(--aniName) var(--durTime) linear forwards;animation-play-state:var(--aniPlayState);}
@keyframes bgMove1{from{width:0;}to{width:100%;}}
@keyframes bgMove0{from{width:0;}to{width:100%;}}
</style>
<div id="papa">
<img id="Player" src="https://pic.imgdb.cn/item/67360abdd29ded1a8cc2e4a5.png" alt="">
<img class="dancer" src="" alt="" style="left: 0px; top: 0px; ">
<img class="dancer" src="https://xlaj.cn/assets/file/zp/20231030141805.jpg" alt="" style="left: 200px; top: 70px;">
<img class="dancer" src="0.gif" alt="" style="left: 750px; top: 420px;">
<img class="dancer" src="https://xlaj.cn/assets/file/zp/20231030141805.jpg" alt="" style="left: 500px; top: 170px;">
<div class="lrcShow" data-lrc="一世漂泊一世空">一世漂泊一世空</div>
</div>
<script>
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(\'d\'n c.a(\'2\')){j.l.q=b(){6(1.7){1.7.h.p(1.7);1.7=o;1.3.i=\'\'}6(1.9){1.8=1.9}};j.l.m=b(){g 2=c.a(\'2\');g 4=1.4,5=1.5;6(4&5){6(!1.9){1.9=1.8}2.4=4;2.5=5;2.3.k=1.3.k;2.3.f=1.3.f;2.d(\'z\').y(1,0,0,4,5);x{1.8=2.A("B/t")}s(e){1.r(\'8\');2.3.w=\'v\';1.h.u(2,1);1.3.i=\'0\';1.7=2}}}}',38,38,'|this|canvas|style|width|height|if|storeCanvas|src|storeUrl|createElement|function|document|getContext||top|var|parentElement|opacity|HTMLImageElement|left|prototype|stop|in|null|removeChild|play|removeAttribute|catch|gif|insertBefore|absolute|position|try|drawImage|2d|toDataURL|image'.split('|'),0,{}))
//-----------------------------------------------------------------
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;}('t y=7(){w 4.T.1d(4,1f)};y.1r={1i:y,T:7(C){x=C.A.J(/(^\\s*)|(\\s*$)/g,\'\');4.8=O.1k(\'.1l\');4.e=4.Q(x);4.P(C.1g)},Q:7(x){t p=x.J(/(^\\s*)|(\\s*$)/g,"").V(/\\r|\\n|\\r\\n/);t 9=1p 1q();F(M l=0;l<p.j;l++){M v=p.1m(/\\[\\d{1,2}:\\d{2}.\\d{1,3}\\]|\\[\\d{1,2}:\\d{2}\\]/g);i(v){H=p.1n(\']\');i(H>0)A=p.U(H+1);F(m=0;m<v.j;m++){L=v.U(1).J(\']\',\'\').V(/:/);B=(+L)*1e+(+L);i(9.j==0&&B!=0){9.S({f:0,G:\'\\1a\\R\\R\\1K\\1L\\1J\\1F\'})}9.S({f:+B.D(2),G:A})}}}9.1H(7(a,b){w(a.f-b.f)});F(k=0;k<9.j-1;k++){9.K=+(9.f-9.f).D(2)}10.Z(9);w 9},X:7(E){4.8.1G=4.8.1M.1v=4.e.G;4.8.o.u(\'--1w\',\'1x\'+(4.c%2));4.8.o.u(\'--E\',E+\'s\');4.8.o.u(\'--I\',\'11\');4.c++},P:7(N){4.6=O.1u("12");4.6.1y=z;4.6.1C=z;4.6.1D=1E;4.6.1z=N;4.8.1B(4.6);t 5=4;t 1b=0;4.c=0;4.6.h(\'1A\',7(){5.c=0;4.q()});4.6.h(\'1t\',7(){5.e.K=+(4.1s-5.e.f).D(2);});4.6.h(\'q\',7(){5.8.o.u(\'--I\',\'11\')});4.6.h(\'13\',7(){i(5.c==1&&4.W<1){5.6.q();w z}5.8.o.u(\'--I\',\'Y\')});4.6.h(\'1I\',7(){10.Z("12 1c, 19 q 15 14");5.8.o.17=\'16\';5.8.18(4)});4.6.h(\'1o\',7(){i(5.c<5.e.j){i(4.W>=5.e.f){5.X(5.e.K)}}});4.8.h(\'1h\',7(){i(5.6.Y){5.6.q()}1j{5.6.13()}})}}',62,111,'||||this|that|mObj|function|lrcShowObj|lrcs|||idx||lrcVec|seconds||addEventListener|if|length||index|||style|parts|play|||var|setProperty|chkTime|return|lyricTxt|lrcPlayerY|false|lrcTxt|_0|opts|toFixed|durTime|for|words|tIdx|aniPlayState|replace|dur|ta|let|mUrl|document|genPlayer|handleLrc|u0020|push|init|substr|split|currentTime|showLrc|paused|log|console|running|audio|pause|event|start|none|display|removeChild|remove|u00A9|turn|wrong|apply|60|arguments|audioURL|click|constructor|else|querySelector|lrcShow|match|lastIndexOf|timeupdate|new|Array|prototype|duration|canplay|createElement|lrc|aniName|bgMove|loop|src|ended|appendChild|muted|autoplay|true|u8f7b|innerHTML|sort|error|u5e74|u4e5f|u66fe|dataset'.split('|'),0,{}))
let lrctxt = `
一世漂泊一世空(合唱版)-王一佳
词：王月
曲：金光赫
编曲：行者孙@晟沐音乐
吉他：行者孙
录音：王金成
混音：龙小晨
合唱：龙小晨合唱团
制作公司：晟沐音乐
制作人：王月
LRC编辑：醉美水芙蓉
谁能陪我赏春花
谁人伴我走天涯
谁会陪我经霜夏
谁知我的身心乏
谁会同我沐秋风
谁能抚我旧日疤
谁能伴我迎冬雪
谁会温暖我的家
一世漂泊一世空
徒留尘世逍遥梦
世间三千六百梦
梦梦都难有归程
一份相思一份痛
一盏残茶对清风
江湖九万七千风
风风自由皆不同
谁能陪我赏春花
谁人伴我走天涯
谁会陪我经霜夏
谁知我的身心乏
谁会同我沐秋风
谁能抚我旧日疤
谁能伴我迎冬雪
谁会温暖我的家
一世漂泊一世空
徒留尘世逍遥梦
世间三千六百梦
梦梦都难有归程
一份相思一份痛
一盏残茶对清风
江湖九万七千风
风风自由皆不同
一世漂泊一世空
徒留尘世逍遥梦
世间三千六百梦
梦梦都难有归程
一份相思一份痛
一盏残茶对清风
江湖九万七千风
风风自由皆不同
江湖九万七千风
风风自由皆不同
谢谢欣赏！
`;
let opts = {
lrcTxt:lrctxt,
audioURL:"https://cccimg.com/view.php/a3c4a24e7a2e7c7c332f8b3609c95d2e.mp3"
}
let yP = new lrcPlayerY(opts);
//-----------------------------------------------------------------------------------------------------//
var dancers = document.querySelectorAll('.dancer');
var mState = () => {
papa.style.setProperty('--state', yP.mObj.paused ? 'paused' : 'running');
Player.title = yP.mObj.paused ? '播放' : '暂停';
dancers.forEach(dancer => yP.mObj.paused ? dancer.stop() : dancer.play());
};
Player.onclick = () => {
yP.mObj.paused ? (yP.mObj.play()) :
(yP.mObj.pause());
}
yP.mObj.onplaying = yP.mObj.onpause = () => mState();
</script> 真漂亮，谢谢醉美版主精彩分享:) 请醉美版主帮我看看，我的贴问题出在哪里，小播怎么不转呢 这个作品漂亮！！！！
页:
[1]