【简静音画】因为有你（致：若依）

花简静 · 发表于 2024-1-24 19:41

花简静 · 发表于 2024-1-24 19:41

本帖最后由花简静于 2024-2-19 20:45 编辑

<style>
#papa {
    margin: 20px 0 30px calc(50% - 931px);
    width: 1700px;
    height: 900px;
    top:130px;
    background: url('https://pic.imgdb.cn/item/65abc85c871b83018a85daa7.webp') no-repeat center/cover,
    radial-gradient(orange,black,blue);
    background-blend-mode: difference;
    box-shadow: 3px 3px 20px #000;
    overflow: hidden;
    position: relative;
    z-index: 1; }
#papa video {
    position: absolute;
    left: 160px;
    bottom: 30px;
    transform: rotateY(180deg);
    width: 900px;
    height: 600px;
    object-fit: cover;
    clip-path: ellipse(420px 300px at center);
    mix-blend-mode: screen;
    opacity: .55;
}
</style>

<div id="papa">
    <video src="https://img.tukuppt.com/video_show/2418175/00/85/14/60fc1c9354d89.mp4" muted loop></video>
</div>

<script>
let sf = document.createElement('script');
sf.src = 'https://638183.freep.cn/638183/web/api/ypPlayer.min.js';
sf.charset = 'utf-8';
document.body.appendChild(sf);
sf.onload = () => {
    let player = new ypP();
    player.setAudSrc('https://music.163.com/song/media/outer/url?id=1367329313');
    player.setBtnCss(`
        width: 300px;
        bottom: 10px;
        left:100px;
        mix-blend-mode: screen;
        --btnBg: url('https://pic.imgdb.cn/item/65abcfa7871b83018aaebe12.gif') no-repeat center/cover;
        --trackBg: transparent;
        --progBg: rgba(10,10,160,0.45);
        --btnSize: 320px;
        opacity: .55;
    `);
    player.setLrcCss(`bottom: 15px;left:50%; transform: translate(-50%); color: rgba(250,250,250,.4); --bg: url('https://pic.imgdb.cn/item/65a3e4f1871b83018a7c76c7.jpg'); font-size: 2.0em;`);
    player.lrcAr = [
    [0.8,"单曲：因为有你",2.1],
    [2.94,"歌手：老狼",1.3],
    [4.27,"所属专辑：因为有你",1.2],
    [5.42,"作词 : 张鹤（广音）",1.0],
    [6.45,"作曲 : 张鹤（广音）",1.1],
    [7.6,"学习黑师《银临-眉南边》动态视频椭圆裁剪效果",4.1],
    [21.02,"我的欢乐来自你笑容",5.2],
    [28.01,"而你如果流泪我会比你更心痛",5.8],
    [36,"我的理想需要你陪我完成",6.0],
    [44.08,"而你给我的爱让我勇气倍增",6.1],
    [52.01,"因为生命中有你",3.1],
    [56.07,"相依相偎彼此的风雨",4.0],
    [61.08,"因为生命中有你",3.7],
    [66.02,"分担分享彼此的苦乐",3.5],
    [71.19,"因为生命中有你",3.1],
    [75.08,"风雨之后彼此更坚强",3.9],
    [80.87,"因为生命中有你",3.1],
    [85.01,"明天的人生会更加温暖",3.9],
    [89.09,"会更加光明",2.2],
    [94,"会更加光明 光明",4.9],
    [122.02,"我的愿望来自你心愿",5.1],
    [129.02,"而你开心快乐我会比你更幸福",5.6],
    [136.03,"我的梦想需要你和我实现",6.6],
    [145.05,"而你给我的爱让我勇往直前",5.9],
    [153.07,"因为生命中有你",2.7],
    [157.03,"相依相偎彼此的风雨",3.5],
    [162.05,"因为生命中有你",3.4],
    [167.12,"分担分享彼此的苦乐",3.0],
    [172.04,"因为生命中有你",3.0],
    [176,"风雨之后彼此更坚强",4.0],
    [181.01,"因为生命中有你",3.7],
    [186.03,"明天的人生会更加温暖",3.6],
    [191.08,"因为生命中有你",3.1],
    [195.04,"相依相偎彼此的风雨",4.0],
    [200.06,"因为生命中有你",3.8],
    [205.05,"分担分享彼此的苦乐",3.5],
    [210.32,"因为生命中有你",3.1],
    [215.06,"风雨之后彼此更坚强",3.1],
    [220.13,"因为生命中有你",2.8],
    [224.03,"明天的人生会更加温暖",4.0],
    [228.05,"会更加光明",2.5],
    [233.01,"会更加美好 美好",4.8]
];
};
</script>
<br><br><br><br><br><br><br><br><br><br>