秋水共长天一色
本帖最后由 梦江南 于 2025-2-27 14:40 编辑 <br /><br /><style>#papa { position: relative; width: 756px; height: 560px; background: #666 url('https://pic1.imgdb.cn/item/67bd607bd0e0a243d404a01a.gif');
box-shadow: 4px 4px 10px #000; z-index: 1; margin: 140px 0 48px calc(50% - 380px);overflow:hidden; border-radius:32px;}
#Player { position: absolute; cursor: GhostWhite; transition: 1.2s; animation: rot 8s linear infinite var(--state); z-index:10;}
#Player:nth-of-type(1) { width: 70px; height: 70px; left: 100px; top: 400px; --deg: 1turn; }
#Player:hover { filter: hue-rotate(60deg) drop-shadow(0,0,47px #FFA500); --state: paused; }
@keyframes rot { to { transform: rotate(var(--deg)); } }
.dancer { position: absolute; cursor: pointer;z-index:1;}
.lrcShow{font:normal 25px sans-serif;position:absolute;top:90%;left:5%;color:Yellow;filter:drop-shadow(1px 1px 1px Gray);letter-spacing:2px;--aniName:bgMove1;--durTime:100ms;--aniPlayState:running;cursor:Yellow;z-index:449;}
.lrcShow::before{position:absolute;content:attr(data-lrc);width:0;height:100%;left:0;top:0;color:Peru;color:Chocolate;background-image:linear-gradient(60deg,hsl(0,100%,50%),hsl(120,100%,50%),hsl(120,100%,50%),hsl(120,100%,50%),hsl(0,100%,50%));-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://638183.freep.cn/638183/t23/btn/meihua_133482968750383750.png" alt="">
<img class="dancer" src="https://pic1.imgdb.cn/item/67bd607bd0e0a243d404a01a.gif" alt="" style="left: 0px; top: 0px; ">
<img class="dancer" src="http://tuku.link/imgs/2023/10/de14c581eb6e09c2.gif" alt="" style="width: 350px; height: 193px; left: 350px; top: 150px;">
<img class="dancer" src="https://pic1.imgdb.cn/item/67be775cd0e0a243d405d381.png" alt="" style="width: 50px; height: 170px; left: 60px; top: 150px;">
<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/15b06c2486d0d4e371bcc17756d66ead.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> 鸣谢小辣椒的代码。 https://img.soogif.com/olrt53z1tMMdY6VqE2K7nSCkMRVWeFe0.gif 这首歌曲有意思，还带报幕的语音呢{:4_173:}
水波很漂亮，还有漂亮的飞鸟效果。那个古人好像身高矮了点。 欣赏江南好帖，这个可以一键全控呢{:4_199:} 起个网名好难 发表于 2025-2-27 12:32
谢谢老师欣赏支持，问好！ 红影 发表于 2025-2-27 13:19
这首歌曲有意思，还带报幕的语音呢
水波很漂亮，还有漂亮的飞鸟效果。那个古人好像身高矮了点。
回影子，这首歌曲是从酷我中录音下来的。这代码中的歌词花潮版歌词不能用，只好付了38元钱做了这首歌词。
水波是用软件做的，这幅照片是论坛的一位老师拍摄的。 红影 发表于 2025-2-27 13:20
欣赏江南好帖，这个可以一键全控呢
这是小辣椒的代码，很羡慕能一键控制。只是这幅照片放大了水波走样了，所以只能这么小了。 梦江南 发表于 2025-2-27 14:40
回影子，这首歌曲是从酷我中录音下来的。这代码中的歌词花潮版歌词不能用，只好付了38元钱做了这首歌词。 ...
http://www.eev3.com/so/%E6%BB%95%E7%8E%8B%E9%98%81%E5%BA%8F.html
这么多选一个不好吗，免费的。 起个网名好难 发表于 2025-2-27 14:59
http://www.eev3.com/so/%E6%BB%95%E7%8E%8B%E9%98%81%E5%BA%8F.html
这么多选一个不好吗，免费的。
不知道有这么个音乐台，看了下有歌词，但没有MP3链接地址啊？ 起个网名好难 发表于 2025-2-27 14:59
http://www.eev3.com/so/%E6%BB%95%E7%8E%8B%E9%98%81%E5%BA%8F.html
这么多选一个不好吗，免费的。
旁边有下载，但出来的是这样的：
https://pic1.imgdb.cn/item/67c051bfd0e0a243d40742b4.png 梦江南 发表于 2025-2-27 15:10
不知道有这么个音乐台，看了下有歌词，但没有MP3链接地址啊？
MP3下载需要点技巧，直接去下会碰钉子的{:5_106:} 起个网名好难 发表于 2025-2-27 15:27
MP3下载需要点技巧，直接去下会碰钉子的
您要告诉我啊，本来38元钱可以付给您了。{:4_172:} 本帖最后由 起个网名好难 于 2025-2-27 15:56 编辑 <br /><br />梦江南 发表于 2025-2-27 15:19
旁边有下载，但出来的是这样的：
<audio src="https://cccimg.com/view.php/d4949e2fb2eb34132ece9b8262631af8.aac"
controls/>
这是一段朗诵，不是歌曲呀。
梦江南 发表于 2025-2-27 15:35
您要告诉我啊，本来38元钱可以付给您了。
穷啊，图片、歌曲都只好找不要钱的 起个网名好难 发表于 2025-2-27 15:37
穷啊，图片、歌曲都只好找不要钱的
不是穷，这是本事。 https://cccimg.com/view.php/d4949e2fb2eb34132ece9b8262631af8.aac
梦江南 发表于 2025-2-27 15:46
不是穷，这是本事。
穷则思变{:5_106:} 起个网名好难 发表于 2025-2-27 15:56
穷则思变
赞同！ 梦江南 发表于 2025-2-27 16:06
赞同！
https://pic1.imgdb.cn/item/67c050d8d0e0a243d40742ab.jpg
试着做几次就会了
页:
[1]
2