<style>#papa {
margin: 0 0 0 calc(50% - 881px);
width: 1600px;
height:1000px;
top:130px;
background: url('https://pic.imgdb.cn/item/652640f7c458853aef6b0874.jpg') no-repeat center/cover;
box-shadow: 4px 4px 8px black;
overflow: hidden;
display: grid;
place-items: center;
z-index: 1;
position: relative;
--state: running;
}
#sky { position: absolute; width: 50%; height: 50%; top: 20;right:10px; }
#vid {
position: absolute;
width: 110%;
height: 100%;
right:-350px;
top:-50px;
object-fit: cover;
pointer-events: none;
mix-blend-mode: screen;
z-index: 1;
opacity: .56;
}
</style>
<div id="papa">
<video id="vid" src="https://img.tukuppt.com/video_show/2418175/00/01/38/5b41f56b0c7fb.mp4" autoplay="" loop="" muted=""></video>
<div id="sky"></div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1392719801" autoplay="" loop=""></audio></div>
<script>
(function() {
let lrcAr = [
[0.7,"单曲：暖暖",1.9],
[2.62,"歌手：王伟丞",1.6],
[4.22,"所属专辑：为光",1.5],
[5.73,"作词 : 李焯雄",2.2],
[7.97,"作曲 : 人工卫星",3.1],
[11.97,"学习套用黑师《失序者》自由路径播放效果",4.1],
[19.02,"都可以是真的",1.6],
[20.64,"你说的 我都愿意去",2.7],
[23.31,"小火车 摆动的旋律",4.3],
[27.56,"都可以是真的",1.8],
[29.32,"你说的 我都会相信",2.7],
[32.03,"因为我完全信任你",4.5],
[36.51,"细腻的喜欢",2.2],
[38.67,"毛毯般的厚重感",2.1],
[40.81,"晒过太阳熟悉的安全感",4.3],
[45.13,"分享热汤 我们两支汤匙一个碗",4.4],
[49.58,"左心房 暖暖的好饱满",4.3],
[53.88,"我想说其实你很好",2.1],
[56.02,"你自己却不知道",2.8],
[58.77,"真心的对我好 不要求回报",2.2],
[60.98,"爱一个人希望她过更好",6.5],
[67.48,"打从心里暖暖的",2.2],
[69.67,"你比自己更重要",3.1],
[72.79,"",20.3],
[93.06,"都可以随便的",1.7],
[94.8,"你说的 我都愿意去",2.7],
[97.53,"回忆里 满足的旋律",4.2],
[101.75,"都可以是真的",1.7],
[103.49,"你说的 我都会相信",2.7],
[106.19,"因为我完全信任你",4.4],
[110.56,"细腻的喜欢",2.3],
[112.88,"你手掌的厚实感",2.1],
[114.94,"什么困难都觉得有希望",4.3],
[119.25,"我哼着歌 你自然的就接下一段",4.4],
[123.61,"我知道 暖暖就在胸膛",4.4],
[128.04,"我想说其实你很好",2.2],
[130.2,"你自己却不知道",2.8],
[133.01,"真心的对我好 不要求回报",4.3],
[137.3,"爱一个人希望她过更好",4.3],
[141.65,"打从心里暖暖的",2.2],
[143.89,"你比自己更重要",3.1],
[147.01,"我想说其实你很好",2.9],
[149.86,"你自己却不知道",2.8],
[152.61,"从来都很低调 自信心不高",4.4],
[156.97,"爱一个人希望她过更好",4.3],
[161.28,"打从心里暖暖的",2.2],
[163.5,"你比自己更重要",22.6],
[186.07,"我想说其实你很好",3.1],
[189.18,"你自己却不知道",2.7],
[191.89,"真心的对我好 不要求回报",4.4],
[196.25,"爱一个人希望她过更好",4.4],
[200.61,"打从心里暖暖的",2.2],
[202.81,"你比自己更重要",3.2],
[206.04,"我想说其实你很好",3.0],
[209.04,"你自己却不知道",2.5],
[211.52,"从来都很低调 自信心不高",4.3],
[215.87,"爱一个人希望她过更好",4.3],
[220.13,"打从心里暖暖的",2.3],
[222.48,"你比自己更重要",6]
];
let js1 = 'https://638183.freep.cn/638183/web/api/svg_path_lrc.js',
js2 = 'https://638183.freep.cn/638183/web/lizi/h5lz_2d.js';
let loadJs = (url,callback) => {
let body = document.querySelector('body'), jsNode = document.createElement('script');
jsNode.charset = 'utf-8';
jsNode.setAttribute('src', url);
body.appendChild(jsNode);
jsNode.onload = () => callback();
};
loadJs(js1, () => {
HCPlayer({
papa: '#papa',
lrcAr: lrcAr,
lrc_css: 'top: 20px;',
fs_css: 'bottom: 5%; left:5%;background: transparent;',
player_css: 'width: 240px; height: 380px; bottom: 34%;right:26%;',
path: 'M160 10 C10 10, 90 200, 160 300',
btn: {left: 104, top: 40},
track: {track: '#BDB76B', prog: '#006400'},
img: {play: 'https://pic.imgdb.cn/item/651e4459c458853aef198abe.png', pause: 'https://pic.imgdb.cn/item/651e445ec458853aef198b6e.png'}
});
});
loadJs(js2, () => {
H5lz({
papa: '#sky',
total: 70,
size: {width: 10, height: 10},
shape: {background: '', borderRadius: ''},
ani: 'toLeft',
maxTime: 30,
offset: {x: 0, y:0},
});
});
})();
document.querySelector('.papa').onclick = () => aud.paused ? vid.pause() : vid.play();</script>
<br><br><br><br><br><br><br><br><br><br>
发表于 2024-2-11 15:10
发表于 2024-2-11 18:44
