本帖最后由 花简静 于 2024-8-18 15:10 编辑
<style>
#papa {
margin: 0 0 0 calc(50% - 931px);
width: 1700px;
height: 900px;
top:130px;
background: url('https://pic.imgdb.cn/item/659ac14b871b83018aede52e.webp') no-repeat center/cover;
box-shadow: 3px 3px 20px #000;
overflow: hidden;
position: relative;
z-index: 1;
}
#mypic
{ position: absolute; width: 260px;eidth:160px;left: 360px; top: 420px; transition: filter 1s; cursor: pointer; mix-blend-mode: screen; animation: rotating 5s infinite linear var(--state); z-index: 10;}
#mypic:hover { filter: hue-rotate(360deg); }
@keyframes rotating { to { transform: rotate(360deg); } }
#vid {
position: absolute;
width: 100%;
height: 110%;
top：-80px;
opacity: .36;
mix-blend-mode: screen;
object-fit: cover;
pointer-events: none;
}
</style>
<div id="papa"><video id="vid" src="https://img.tukuppt.com/video_show/15653652/01/47/93/634e43eeab459.mp4" autoplay loop muted></video>
<img id="mypic" src="https://pic.imgdb.cn/item/659ab641871b83018ab6b491.png" alt="" />
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1947926942" autoplay loop></audio>
</div>
<script>
let sFile = document.createElement('script');
sFile.src = 'https://638183.freep.cn/638183/web/api/lrc.js';
sFile.charset = 'utf-8';
document.head.appendChild(sFile);
sFile.onload = () => {
LRC({
papa: '#papa',
lrcAr: geci,
btn: '#mypic',
lrc_css: 'left: 50%; transform: translate(-50%); bottom: 10px;',
});
};
let geci = [
[-0.2,"单曲： 清风",0.7],
[0.5,"歌手：陈壹千",0.9],
[1.45,"他强任他强 清风拂山岗",2.6],
[4.07,"它会穿山越岭带我窥见光",4.0],
[8.08,"漫长旅途每一站人来人往",5.3],
[15.01,"他强任他强 清风拂山岗",3.3],
[18.28,"它会穿山越岭带我窥见光",3.7],
[22.01,"愿那时的梦 相伴岁月生长",3.1],
[25.09,"愿我们的心 始终清澈明朗",5.5],
[33.02,"一座围城 两个自我",3.7],
[39.08,"奔跑追逐 每个日落",4.3],
[45.03,"模糊脚步 大雨滂沱",3.6],
[49.05,"星光路过我 走散了",2.5],
[52.07,"在黯然的时刻 谁听我说",4.9],
[60.05,"我和他们 世界相隔",3.8],
[67.17,"遗憾需要时间消磨",3.7],
[73.11,"孤独旅人 不会停泊",3.0],
[76.09,"风吹过彼岸 有梦路过",3.7],
[80.09,"它终会眷顾 渺小的我",4.6],
[86.63,"他强任他强 清风拂山岗",3.7],
[90.29,"它会穿山越岭带我窥见光",3.2],
[94.53,"漫长旅途每一站人来人往",5.5],
[100.06,"他强任他强 清风拂山岗",3.9],
[103.96,"它会穿山越岭带我窥见光",4.3],
[108.3,"愿那时的梦 相伴岁月生长",2.8],
[111.07,"愿我们的心 始终清澈明朗",5.3],
[132.06,"我和他们 世界相隔",3.8],
[139.03,"遗憾需要时间消磨",3.9],
[145.18,"孤独旅人 不会停泊",2.9],
[148.07,"风吹过彼岸 有梦路过",4.0],
[152.08,"它终会眷顾 渺小的我",5.0],
[158.01,"他强任他强 清风拂山岗",4.3],
[162.28,"它会穿山越岭带我窥见光",4.3],
[166.56,"漫长旅途每一站人来人往",5.0],
[172.03,"他强任他强 清风拂山岗",3.0],
[175.05,"它会穿山越岭带我窥见光",5.2],
[180.27,"愿那时的梦 相伴岁月生长",2.9],
[183.21,"愿我们的心 始终清澈明朗",4.5],
[189.04,"他强任他强 清风拂山岗",3.6],
[193.1,"它会穿山越岭带我窥见光",3.3]
];
</script>
<br><br><br><br><br><br><br><br><br><br>
|
