<style>
#papa {
margin: 0 0 0 calc(50% - 931px);
width: 1700px;
height: 900px;
top:130px;
box-shadow: 4px 8px 28px gray;
background: url('https://pic.imgdb.cn/item/6587e645c458853aef9ba9cd.webp');
display: grid;
place-items: center;
position: relative;
overflow: hidden;
}
#vid {
position: absolute;
width: 100%;
height: 110%;
opacity: .20;
top:-8%;
object-fit: cover;
mix-blend-mode: screen;
pointer-events: none;
}
li-zi {
position: absolute;
width: 36px;
height: 36px;
top: calc(44% - 5px);
border-radius: 50%;
background: navy;
opacity: .70;
z-index: 5;
animation: moving var(--duration) var(--delay) linear infinite alternate var(--state);
}
@keyframes moving {
from { transform: translate(0,0); }
to { transform: translate(var(--xx),var(--yy)); }
}
</style>
<div id="papa"><video id="vid" src="https://img.tukuppt.com/video_show/2418175/00/44/85/6041e100be083.mp4" autoplay loop muted></video></div>
<script>
let total = 80;
let rx = papa.offsetWidth / 2 -10, ry = papa.offsetHeight / 2 + 260;
Array.from({length: total}).forEach((item,key) => {
let rad = (Math.PI / 120) * 360 / total;
item = document.createElement('li-zi');
item.style.cssText += `
--xx: ${rx * Math.cos(rad * key)}px;
--yy: ${ry * Math.sin(rad * key)}px;
--duration: ${5 + Math.random() * 6}s;
--delay: -${Math.random() * 6}s;
background: url('https://pic.imgdb.cn/item/6587b11ac458853aefbbd724.png') no-repeat center/cover;
`;
papa.appendChild(item);
});
let sf = document.createElement('script');
sf.src = 'https://638183.freep.cn/638183/web/api/mplayer.js';
sf.charset = 'utf-8';
document.body.appendChild(sf);
sf.onload = () => {
let myplayer = new mPlayer();
myplayer.setAudSrc('https://music.163.com/song/media/outer/url?id=1456021713');
myplayer.setBtnCss(`
background: url('https://pic.imgdb.cn/item/6587d1fcc458853aef4a2241.png') no-repeat center/cover;
width: 200px;
height: 200px;
bottom: 400px;
right:44%;
filter: opacity(.65);
`);
myplayer.setLrcCss('color: Thistle;font-size: 20px;left:210px;bottom: 80px;opacity: .70;--bg: linear-gradient(180deg, White, #DC143C);');
myplayer.lrcAr = [
[1,"单曲：Eyes on me (Live)",3.0],
[3.95,"歌手：周深",1.9],
[5.84,"所属专辑：江苏卫视天猫超级晚",2.1],
[7.94,"作词 : 染谷和美",2.5],
[10.41,"作曲 : 植松伸夫",1.7],
[12.1,"原唱：王菲",2.3],
[14.36,"学习黑师《游心》粒子来回飞效果",4.7],
[19.01,"",14.0],
[33,"Whenever sang my songs<br>每每当我开始吟唱",4.2],
[39.06,"On the stage on my own<br>独自伫立舞台之上",3.8],
[44.08,"Whenever said my words<br>每每当我倾诉心迹",5.0],
[49.06,"Wishing they would be heard<br>皆期待它们有朝为人所闻",5.0],
[54.06,"I saw you smiling at me<br>目光相聚 你对我一笑粲然",4.5],
[59.53,"Was it real or just my fantasy<br>我瞬间迷失幻境",5.5],
[65.05,"You'd always be there in the corner<br>你时常孑然孤身",4.5],
[70.01,"Of this tiny little bar<br>守在小酒吧寥落一角",4.3],
[75.08,"My last night here for you<br>最后一夜 我独为你而来",4.1],
[81,"Same old songs just once more<br>为你再吟 陈年老歌一曲",4.5],
[86.06,"My last night here with you<br>最后一夜 只愿与你相伴",5.9],
[92.07,"Maybe yes maybe no<br>今宵诀别 重逢相见或难",3.6],
[97.05,"I kind of liked it your way<br>我爱你凝视我的模样",4.2],
[102.25,"How you shyly placed your eyes on me<br>你的羞涩目光流转我身畔",4.1],
[108.08,"Oh did you ever know<br>你可知晓",3.5],
[112.08,"That I had mine on you<br>我的目光也曾为你顾盼停驻",4.8],
[118.88,"",1.2],
[120.08,"Darling so there you are<br>我的挚爱 你翩跹而来",3.8],
[125,"With that look on your face<br>伴随你的飞扬神采",3.9],
[131.06,"As if you're never hurt<br>仿若未曾饱受伤害",3.2],
[136.25,"As if you're never down<br>仿若未曾坠入深渊",2.8],
[141.06,"Shall I be the one for you<br>我是否有幸做你的此生唯一",3.6],
[146.04,"Who pinches you softly but sure<br>会亲昵地拧你皮肤 却笃定地爱你",5.3],
[152.06,"If frown is shown then<br>当你隽眉微蹙",3.9],
[156.07,"I will know that you're no dreamer<br>我便知你惊于梦魇",3.4],
[166.02,"",24.0],
[190.07,"So let me come to you<br>许我万水千山 赴你而来",3.8],
[196.31,"Close as I wanna be<br>许我亲密无间 拥你入怀",3.5],
[201.53,"Close enough for me<br>以至于我足以",3.0],
[206.01,"To feel your heart beating fast<br>感受你的心跳",5.9],
[212.21,"And stay there as I whisper<br>我将俯身在你耳畔低语 告诉你",4.6],
[217.01,"How I love you peaceful eyes on me<br>我爱你凝视我时的安谧目光至极",4.2],
[223.17,"Did you ever know<br>你可知晓",2.6],
[227.05,"That I had mine on you<br>我的目光也曾为你顾盼停驻",4.4],
[232.53,"",2.6],
[235.17,"Darling so share with me<br>亲爱的 尽可将你的心迹倾诉",3.0],
[240.21,"Your love if you have enough<br>那些足以满溢的赤忱之爱",3.1],
[245.06,"Your tears if you're holding back<br>那些默默压抑的晶莹泪滴",4.2],
[250,"Or pain if that's what it is<br>或是独自承担的苦痛",4.6],
[256.01,"How can I let you know<br>我该如何让你知晓",3.6],
[261.38,"I'm more than the dress and the voice<br>我的爱不似华丽衣装 亦难凭言语丈量",5.8],
[268.04,"Just reach me out then<br>只要靠近我 触碰我",2.0],
[270.04,"You will know that you're not dreaming<br>你就明了 一切并非幻象蜃楼",5.9],
[278.63,"",-1.6],
[277.01,"Darling so there you are<br>我的挚爱 你翩跹而来",3.8],
[283.1,"With that look on your face<br>伴随你的飞扬神采",3.1],
[288.84,"As if you're never hurt<br>仿若未曾饱受伤害",3.4],
[294.02,"As if you're never down<br>仿若未曾坠入深渊",3.4],
[298.06,"Shall I be the one for you<br>我是否有幸做你的此生唯一",4.0],
[304.2,"Who pinches you softly but sure<br>会亲昵地拧你皮肤 却更笃定地爱你",5.1],
[310,"If frown is shown then<br>当你隽眉微蹙",3.1],
[313.08,"I will know that you're no dreamer<br>我将牵着你 走出梦魇 奔赴漫天星光",4.8]
];
};
</script>
<br><br><br><br><br><br><br><br><br>
发表于 2024-1-25 21:03
发表于 2024-1-25 21:05
