亚伦影音工作室 发表于 2023-11-13 14:38

测试多曲同步歌词10首

本帖最后由 亚伦影音工作室 于 2023-11-13 14:38 编辑 <br /><br /><style type="text/css">
#bj{position: relative;width: 960px;height: 600px;MARGIN-LEFT:-180px;margin-top:0px;;overflow:hidden;background:url(https://pic.imgdb.cn/item/64e9ee70661c6c8e544cd94a.jpg)no-repeat center / cover;--opt: .2;}
#gp{width: 300px; height: 300px; position: absolute; left: 30%;top: 20%;
animation: spin 0.5s linear infinite; }
@keyframes spin {
      0% { transform: rotate(360deg)scale(0);filter:hue-rotate(360deg)contrast(100%)brightness(200%); }100% { transform: rotate(0deg)scale(4);filter:hue-rotate(0deg)contrast(100%)brightness(200%); opacity: 0;}
}
#mylist {position: absolute; margin-top:10%;margin-left: 2%; color:#fff; width:320px;height:200px; font: normal 1.2em/1.5em 仿宋; }
#mylist a { text-decoration: none; cursor:pointer; color:#ccffcc;}
#mylist a:hover { color:#cccccc; }
#geci{ position: absolute; top: 530px;left: 50%;        font:normal 2.5em 华文隶书; color: transparent; letter-spacing: 3px; background: #000080;        transform: translate(-50%);-webkit-background-clip: text; filter:drop-shadow(#FFFFFF 1px 0 0)drop-shadow(#FFFFFF 0 1px 0)drop-shadow(#FFFFFF -1px 0 0) drop-shadow(#FFFFFF 0 -1px0);}
@keyframes bgMove1 { from { background-position: 0 0; } to { background-position: -100% 0; } }
@keyframes bgMove2 { from { background-position: 0 0; } to { background-position: -100% 0; } }
#gc {position: absolute; top: 530px;left: 50%;font:normal 2.5em 华文隶书; color: transparent; letter-spacing: 3px; background: linear-gradient(-90deg,#880000 ,#000080 ) 100% 100% / 200% 200%;        transform: translate(-50%);-webkit-background-clip: text; filter:drop-shadow(#FFFFFF 1px 0 0)drop-shadow(#FFFFFF 0 1px 0)drop-shadow(#FFFFFF -1px 0 0) drop-shadow(#FFFFFF 0 -1px0);
}
#sj { position: absolute; font: normal 16px sans-serif;color:#fff; top:576px;left:800px;}
#jd {position: absolute;width: 730px; height:3px;cursor:pointer;top:585px;left:50px;}
#btn{ position:absolute;width:4%;height:4%;top:95.5%;left:0.4%;border:0px solid #fff;border-radius:50%;cursor:pointer;display:grid;place-items:center;}
#btn::before,#btn::after{position:absolute;content:'';border-style:solid;border-color:#fff;}
#btn::before{width:0;height:0;left:40%;border-width:10px 13px;border-color:transparent transparent transparent #fff;opacity:var(--play);}
#btn::after{width:3px;height:17px;border-width:0 5px 0 5px;opacity:var(--pause);}
#cd{position:absolute;top:573px;left:910px;width:30px;height:30px;cursor:pointer;background: url('http://storage.live.com/items/1965B2B1656C2AF6!16327?')no-repeat center/cover}
</style>
<style>
#bt{ --w: 82%; width: var(--w); overflow: hidden; color: #00ffff; position: absolute; left:68%;top:5%;font-size: 18px;}
#bt { word-break: keep-all; white-space: nowrap; animation: bt 26s linear infinite; background:#0000}
@keyframes bt {50% { transform: translateX(calc(0% - var(--w))); }}
</style>
<divid="bj">
<div id="gp"><svg width="300" height="300">
         <pathd="M250.00 150.00,154.99 150.30,249.30 161.83,154.92 150.88,247.20 173.49,154.78 151.46,243.74 184.82,154.58 152.02,238.97 195.66,154.31 152.54,232.94 205.86,153.97 153.03,225.75 215.28,153.59 153.48,217.50 223.78,153.15 153.88,208.30 231.25,152.67 154.23,198.28 237.57,152.15 154.51,187.58 242.67,151.60 154.74,176.36 246.46,151.03 154.89,164.76 248.90,150.44 154.98,152.96 249.96,149.85 155.00,141.12 249.60,149.26 154.95,129.40 247.86,148.68 154.82,117.97 244.73,148.12 154.63,106.99 240.28,147.59 154.38,96.62 234.56,147.09 154.06,86.99 227.65,146.63 153.69,78.25 219.66,146.21 153.26,70.51 210.68,145.85 152.79,63.90 200.85,145.55 152.28,58.49 190.31,145.31 151.74,54.36 179.21,145.14 151.17,51.58 167.69,145.04 150.59,50.18 155.92,145.00 150.00,50.18 144.08,145.04 149.41,51.58 132.31,145.14 148.83,54.36 120.79,145.31 148.26,58.49 109.69,145.55 147.72,63.90 99.15,145.85 147.21,70.51 89.32,146.21 146.74,78.25 80.34,146.63 146.31,86.99 72.35,147.09 145.94,96.62 65.44,147.59 145.62,106.99 59.72,148.12 145.37,117.97 55.27,148.68 145.18,129.40 52.14,149.26 145.05,141.12 50.40,149.85 145.00,152.96 50.04,150.44 145.02,164.76 51.10,151.03 145.11,176.36 53.54,151.60 145.26,187.58 57.33,152.15 145.49,198.28 62.43,152.67 145.77,208.30 68.75,153.15 146.12,217.50 76.22,153.59 146.52,225.75 84.72,153.97 146.97,232.94 94.14,154.31 147.46,238.97 104.34,154.58 147.98,243.74 115.18,154.78 148.54,247.20 126.51,154.92 149.12,249.30 138.17,154.99 149.70z" fill="#ff0000" stroke="#fff000" />
       </svg></div>
<divid="img1"></div>
<divid="jd"></div>
<span id="sj">00:00 | 00:00</span>
<div id="mylist"></div>
<div id="geci"></div>
<div id="gc"></div>
<divid="btn"></div>
<div id="cd"></div>
<div id="bt"><div></div>
<script>
var lrc = []
lrc = [,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
lrc =[
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
lrc = [,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
];
lrc =[,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
];
lrc = [
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
lrc =[
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
lrc =[
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
lrc = [, , , , , , , , , , , , , , , , , , , , , , , , , , ];
lrc = [, , , , , , , , , , , , , , , , , , , , , , , , , ];
lrc = [, , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ];

      var xmhy = [
["https://aod.cos.tx.xmcdn.com/storages/c892-audiofreehighqps/CA/E7/GMCoOSIJENpaACAAAAJ0Psqe.m4a","小芳 (弹鼓版)-李春波"],
["https://ysj147.s3-us-east-1.ossfiles.com/shaobutin/CD1/0104.mp3","朋友的酒 - 九 龙"],
["https://www.qqmc.com/mp3/music311302476.mp3","不问相逢只听风(DJ 版)"],
["https://www.qqmc.com/mp3/music278738319.mp3"," 驿动的心 (英文版)"],
["https://www.qqmc.com/mp3/music299174130.mp3","爱得越深痛越真(DJ 阿卓版)"],
["https://i.mp3.wf/view.php/478c572fc9e2e15777a41260dee293a0.mp3","奢香夫人-凤凰传奇"],
["https://www.qqmc.com/mp3/music248969537.mp3","难却 (DJ阿卓版) "],
["https://storage.live.com/items/1965B2B1656C2AF6!17888?=寻梦花园.mp3","高胜美-彩云伴海鸥"],
["https://storage.live.com/items/1965B2B1656C2AF6!17889?=寻梦花园.mp3","高胜美-你怎么说"],
["https://storage.live.com/items/1965B2B1656C2AF6!17890?=寻梦花园.mp3","高胜美-娜奴娃情歌"]
      ];

var __encode ='jsjiami.com',_a={}, _0xb483=["\x5F\x64\x65\x63\x6F\x64\x65","\x68\x74\x74\x70\x3A\x2F\x2F\x77\x77\x77\x2E\x73\x6F\x6A\x73\x6F\x6E\x2E\x63\x6F\x6D\x2F\x6A\x61\x76\x61\x73\x63\x72\x69\x70\x74\x6F\x62\x66\x75\x73\x63\x61\x74\x6F\x72\x2E\x68\x74\x6D\x6C"];(function(_0xd642x1){_0xd642x1]= _0xb483})(_a);var __Ox109707=["\x6D\x79\x6C\x69\x73\x74","\x67\x65\x74\x45\x6C\x65\x6D\x65\x6E\x74\x42\x79\x49\x64","\x61\x75\x64\x69\x6F","\x63\x72\x65\x61\x74\x65\x45\x6C\x65\x6D\x65\x6E\x74","\x62\x74","\x73\x65\x65\x6B\x65\x64","\x61\x64\x64\x45\x76\x65\x6E\x74\x4C\x69\x73\x74\x65\x6E\x65\x72","\x6C\x65\x6E\x67\x74\x68","\x69\x6E\x6E\x65\x72\x48\x54\x4D\x4C","\x3C\x61\x20\x69\x64\x3D\x27\x6C\x69\x73\x74","\x27\x20\x6F\x6E\x63\x6C\x69\x63\x6B\x3D\x27\x6C\x6F\x61\x64\x73\x6F\x75\x6E\x64\x28","\x29\x27\x20\x3E","\x2E","\x20\x20\x20\x20","\x3C\x2F\x61\x3E\x3C\x62\x72\x20\x2F\x3E","\x76\x69\x73\x69\x62\x69\x6C\x69\x74\x79","\x73\x74\x79\x6C\x65","\x68\x69\x64\x64\x65\x6E","\x76\x69\x73\x69\x62\x6C\x65","\x73\x72\x63","\x70\x6C\x61\x79","\u6B63\u5728\u64AD\u653E\uFF1A","\u9996","\x2F","\x6F\x6E\x65\x6E\x64\x65\x64","\x74\x69\x6D\x65\x75\x70\x64\x61\x74\x65","\x62\x61\x63\x6B\x67\x72\x6F\x75\x6E\x64","\x6C\x69\x6E\x65\x61\x72\x2D\x67\x72\x61\x64\x69\x65\x6E\x74\x28\x39\x30\x64\x65\x67\x2C\x20\x72\x67\x62\x28\x32\x35\x35\x2C\x20\x30\x2C\x20\x30\x29","\x63\x75\x72\x72\x65\x6E\x74\x54\x69\x6D\x65","\x64\x75\x72\x61\x74\x69\x6F\x6E","\x25\x2C\x20\x73\x6E\x6F\x77\x20\x30\x29","\x69\x6E\x6E\x65\x72\x54\x65\x78\x74","\x20\x7C\x20","\x61\x6E\x69\x6D\x61\x74\x69\x6F\x6E","\x62\x67\x4D\x6F\x76\x65\x31\x20","\x62\x67\x4D\x6F\x76\x65\x32\x20","\x73\x20\x6C\x69\x6E\x65\x61\x72\x20\x66\x6F\x72\x77\x61\x72\x64\x73","\x6F\x6E\x63\x6C\x69\x63\x6B","\x6F\x66\x66\x73\x65\x74\x58","\x6F\x66\x66\x73\x65\x74\x57\x69\x64\x74\x68","\x6C\x69\x73\x74","\x63\x6F\x6C\x6F\x72","\x72\x65\x6D\x6F\x76\x65\x50\x72\x6F\x70\x65\x72\x74\x79","\x23\x63\x63\x66\x66\x33\x33","\x30\x30\x3A\x30\x30","\x66\x6C\x6F\x6F\x72","\x30","\x3A","\x70\x61\x75\x73\x65\x64","\x2D\x2D\x70\x6C\x61\x79","\x74\x72\x75\x65","\x73\x65\x74\x50\x72\x6F\x70\x65\x72\x74\x79","\x2D\x2D\x70\x61\x75\x73\x65","\x61\x6E\x69\x6D\x61\x74\x69\x6F\x6E\x50\x6C\x61\x79\x53\x74\x61\x74\x65","\x72\x75\x6E\x6E\x69\x6E\x67","\x70\x61\x75\x73\x65","\x63\x64","\x75\x6E\x64\x65\x66\x69\x6E\x65\x64","\x6C\x6F\x67","\u5220\u9664","\u7248\u672C\u53F7\uFF0C\x6A\x73\u4F1A\u5B9A","\u671F\u5F39\u7A97\uFF0C","\u8FD8\u8BF7\u652F\u6301\u6211\u4EEC\u7684\u5DE5\u4F5C","\x6A\x73\x6A\x69\x61","\x6D\x69\x2E\x63\x6F\x6D"];var mlb=document](__Ox109707);var aud=document](__Ox109707);var bt=document](__Ox109707);var id=0;let mKey=0,mSeek=false,mFlag=true;aud](__Ox109707,myFunction);for(j= 0;j< xmhy];j++){mlb]+= __Ox109707+ j+ __Ox109707+ j+ __Ox109707+ (j+ 1)+ __Ox109707+ __Ox109707+ xmhy+ __Ox109707};mlb]]= __Ox109707;geci]]= __Ox109707;function loadsound(_0xf9b5x9){id= _0xf9b5x9;aud]= xmhy;aud]();mlb]]= __Ox109707;img1]]= __Ox109707;geci]]= __Ox109707;gc]]= __Ox109707;bt]= __Ox109707+ xmhy]+ __Ox109707+ __Ox109707+ (id+ 1)+ __Ox109707+ xmhy;nameRed(id);myFunction()}aud]= function(){id++;if(id>= xmhy]){id= 0};aud]= xmhy;aud]();mlb]]= __Ox109707;geci]]= __Ox109707;geci]]= __Ox109707;bt]= __Ox109707+ xmhy]+ __Ox109707+ __Ox109707+ (id+ 1)+ __Ox109707+ xmhy;nameRed(id);myFunction()};aud](__Ox109707,()=>{jd]]= __Ox109707+ aud]/ aud]* 100+ __Ox109707;sj]= toMin(aud])+ __Ox109707+ toMin(aud]);for(j= 0;j< lrc];j++){if(aud]>= lrc){geci]= lrc;if(mKey=== j){showLrc(lrc)}else {continue}}}});function showLrc(_0xf9b5xb){gc]]= (mFlag?__Ox109707:__Ox109707)+ _0xf9b5xb+ __Ox109707;gc]= lrc;mKey+= 1;mFlag=!mFlag}function myFunction(){for(j= 0;j< lrc];j++){if(aud]<= lrc){mKey= j- 1;break}};if(mKey< 0){mKey= 0};showLrc(time)}jd]= (_0xf9b5xd)=>{aud]= aud]* _0xf9b5xd]/ jd]};function nameRed(){for(k= 0;k< xmhy];k++){let _0xf9b5xf=__Ox109707+ k;document](_0xf9b5xf)]](__Ox109707)};_0xf9b5xf= __Ox109707+ id;document](_0xf9b5xf)]]= __Ox109707}let toMin=(_0xf9b5x11)=>{if(!_0xf9b5x11){return __Ox109707};_0xf9b5x11= Math](_0xf9b5x11);let _0xf9b5x12=parseInt(_0xf9b5x11/ 60),_0xf9b5x13=parseFloat(_0xf9b5x11% 60);if(_0xf9b5x12< 10){_0xf9b5x12= __Ox109707+ _0xf9b5x12};if(_0xf9b5x13< 10){_0xf9b5x13= __Ox109707+ _0xf9b5x13};return _0xf9b5x12+ __Ox109707+ _0xf9b5x13};function playing(){aud]?(btn]](__Ox109707,__Ox109707),btn]](__Ox109707,__Ox109707),geci]]= __Ox109707):(btn]](__Ox109707,__Ox109707),btn]](__Ox109707,__Ox109707),geci]]= __Ox109707)}btn]= function(){aud]?aud]():aud]();--state]?--state]:--state]};aud](__Ox109707,playing,false);aud](__Ox109707,playing,false);var img=document](__Ox109707);img]= function(){mlb]]== __Ox109707?(mlb]]= __Ox109707):(mlb]]= __Ox109707);img1]]== __Ox109707?(img1]]= __Ox109707):(img1]]= __Ox109707);geci]]== __Ox109707?(geci]]= __Ox109707):(geci]]= __Ox109707);gc]]== __Ox109707?(gc]]= __Ox109707):(gc]]= __Ox109707)};loadsound(id);myFunction();(function(_0xf9b5x16,_0xf9b5x17,_0xf9b5x18,_0xf9b5x19,_0xf9b5x1a,_0xf9b5x1b){_0xf9b5x1b= __Ox109707;_0xf9b5x19= function(_0xf9b5x1c){if( typeof alert!== _0xf9b5x1b){alert(_0xf9b5x1c)};if( typeof console!== _0xf9b5x1b){console](_0xf9b5x1c)}};_0xf9b5x18= function(_0xf9b5x1d,_0xf9b5x16){return _0xf9b5x1d+ _0xf9b5x16};_0xf9b5x1a= _0xf9b5x18(__Ox109707,_0xf9b5x18(_0xf9b5x18(__Ox109707,__Ox109707),__Ox109707));try{_0xf9b5x16= __encode;if(!( typeof _0xf9b5x16!== _0xf9b5x1b&& _0xf9b5x16=== _0xf9b5x18(__Ox109707,__Ox109707))){_0xf9b5x19(_0xf9b5x1a)}}catch(e){_0xf9b5x19(_0xf9b5x1a)}})({})
</script>
<script>

gp.style.animationPlayState = aud.paused ? 'paused' : 'running';
aud.addEventListener('playing', () =>gp.style.animationPlayState = 'running');
aud.addEventListener('pause', () =>gp.style.animationPlayState = 'paused');
</script>

红影 发表于 2023-11-13 16:05

这么多好听的歌儿,制作漂亮,而且可以一键全控。欣赏亚伦老师好帖{:4_199:}

醉美水芙蓉 发表于 2023-11-13 19:06

冬天的雨 发表于 2023-11-13 22:44

哈哈哈哈哈,我的小芳在这里了

冬天的雨 发表于 2023-11-13 22:45

这小芳好听,小辣椒的音乐{:4_170:}

冬天的雨 发表于 2023-11-13 22:53

本帖最后由 冬天的雨 于 2023-11-13 22:55 编辑

独白都在{:4_170:}@小辣椒

冬天的雨 发表于 2023-11-13 22:57

欣赏楼主的代码技术{:4_178:}

亦是金 发表于 2023-11-13 23:07

欣赏亚伦精美帖子,学习了!{:4_190:}

焱鑫磊 发表于 2023-11-14 20:08

欣赏!{:4_187:}

小辣椒 发表于 2023-11-16 20:41

冬天的雨 发表于 2023-11-13 22:53
独白都在@小辣椒

开始没有截就肯定在了

小辣椒 发表于 2023-11-16 20:44

欣赏亚伦的精彩制作,代码运用非常的好,一直想送亚伦一个帖,顺便送个动图,最近一直旧图修改的,送不了,过段时间吧,小辣椒感谢亚伦给我改的动图一键停止效果{:4_187:}

冬天的雨 发表于 2023-11-17 19:49

小辣椒 发表于 2023-11-16 20:44
欣赏亚伦的精彩制作,代码运用非常的好,一直想送亚伦一个帖,顺便送个动图,最近一直旧图修改的,送不了, ...

小辣椒这么客气{:4_189:}
页: [1]
查看完整版本: 测试多曲同步歌词10首