本帖最后由 花简静 于 2024-8-16 11:47 编辑
<style>
#papa {
margin: 30px 0 30px calc(50% - 641px);
width: 1280px;
height: 720px;
background: transparent;
box-shadow: 0 0 8px gray;
overflow: hidden;
z-index: 1;
display: grid;
place-items: center;
position: relative;
}
#papa > video {
position: absolute;
width: 100%;
height: calc(100% + 230px);
object-fit: cover;
mix-blend-mode: screen;
pointer-events: none;
}
#vid {
position: absolute;
width: 100%;
height: calc(100% + 200px);
object-fit: cover;
opacity: .49;
mix-blend-mode: screen;
}
</style>
<div id="papa" class="papa">
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2114419825" autoplay loop></audio>
<video id="vid" src="https://img.tukuppt.com/video_show/15653652/01/59/07/63806a6eb7241.mp4" autoplay loop muted></video>
<video src="https://link.hhtjim.com/163/5309050.mp4" autoplay loop muted></video>
</div>
<script>
let geci = `[00:00.00]青青河边草\n[02:51.00]`;
var sf = document.createElement('script');
sf.charset = 'utf-8';
sf.src = 'https://638183.freep.cn/638183/web/js2024/line_yslrc.js';
document.body.appendChild(sf);
sf.onload = () => {
HCPlayer({
papa: '#papa',
geci: geci,
skip: 0.5,
average: 0,
lrc_css: 'top: 20px; --bg: linear-gradient(#ffffffaa, #491981e9); color: silver;',
player_css: 'width: 460px; bottom: 20px; color: white; --prog: white; --track: gray; --bg: url("https://638183.freep.cn/638183/t23/btn/meihua_133482968750383750.png") no-repeat center/cover',
fs_css: '--bg: transparent; --color: snow;'
});
};
</script>
| 
发表于 2024-8-16 06:11
发表于 2024-8-16 09:33
又加了JS小播，这个作品含金量很 高。。