小辣椒 发表于 2024-4-20 11:13

画你--学习画布制作按钮


<style>
        #papa { margin: 150px 0 0 calc(50% - 781px);width: 1400px; height:711px; background: url("https://xlaj.cn/assets/file/zp/20240418200401.gif ") no-repeat center/cover; box-shadow: 3px 3px 6px rgba(0,0,0,.5); overflow: hidden; display: grid; place-items: center; position: relative; }
        .play { position: absolute; top: 110px;left: 120px;width: 200px; cursor: pointer; animation: rot 6s linear infinite var(--state); }
        #papa video { position: absolute;left: -50px; bottom: 0; width: 30%; height: calc(30% + 60px); object-fit: cover; mix-blend-mode: screen; }   
        @keyframes rot { to { transform: rotate(360deg); } }

</style>

<div id="papa">


        <audio id="aud" src="https://aod.cos.tx.xmcdn.com/storages/ff73-audiofreehighqps/9F/55/GKwRIRwJk2ADACAAAAKkDdUZ.m4a" autoplay loop></audio>
        <video src="https://lk999.oss-cn-guangzhou.aliyuncs.com/xxsx.mp4" muted autoplay loop></video>
        <img class="play" alt="" src="https://xlaj.cn/assets/file/zp/20240418200447.png" />
</div>

<script type="text/javascript">

var sc = document.createElement('script');
sc.src = 'https://638183.freep.cn/638183/web/api/lrc.js';
sc.charset = 'utf-8';
document.head.appendChild(sc);

sc.onload = () => {
        LRC({
                papa: '#papa',
                lrcAr: lrcAr,
                btn: '.play',
                lrc_css: 'left: 35%; bottom: 50px;transform: translate(-50%);--bg: linear-gradient(rgba(255,228,196,.15),rgba(255,228,196.45)); position: absolute; font: bold 2.0em sans-serif; color:#F0F8FF;',
        });
};

var lrcAr = [
       ,
                ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];

</script>

liumang 发表于 2024-4-21 13:16

这图意境很美{:5_150:}

liumang 发表于 2024-4-21 13:16

画你好像上次也是分享过，好听

小辣椒 发表于 2024-4-28 13:20

liumang 发表于 2024-4-21 13:16
画你好像上次也是分享过，好听

我也是喜欢这首歌{:5_147:}
页: [1]
查看完整版本: 画你--学习画布制作按钮