小辣椒 发表于 2023-10-28 21:42

心然 - 千年缘

本帖最后由 小辣椒 于 2024-5-2 21:51 编辑 <br /><br /><style>
#papa {
      margin: 150px 0 0 calc(50% - 881px);
      width: 1600px;
      height: 866px;
      background: url('https://i.mp3.wf/view.php/6546c15a23a7466f374928aec477e0fb.jpg') no-repeat center/cover;
      box-shadow: 3px 3px 20px #000;
      overflow: hidden;
      z-index: 1;
      position: relative;
      display: grid;
      place-items: center;
}

#vid1 {
    position: absolute;
    width: 100%;
    height: 100%;
               

    object-fit: cover;
    pointer-events: none;
    mix-blend-mode: screen;
    z-index: 2;
    opacity: .95;

}
</style>

<div id="papa">

<video id="vid1" src="https://img-baofun.zhhainiao.com/pcwallpaper_ugc/preview/33367b7570784f2f92f7f23b04a9cd62_preview.mp4" autoplay="" loop="" muted="">
</div>
<audio id="aud" src="https://wj1.zp68.com:812/lxx/yunhua/2022/02/20/03.mp3" autoplay loop></audio>

<script>
(function() {
      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();
      };

      let rippleJs = 'https://638183.freep.cn/638183/web/svg/ripple-min.js',
                playerJs = 'https://xlaj.cn/assets/file/zp/20231029165226.js';
      let lrcAr = [
               ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ];
      loadJs(rippleJs, () => rippleEffect(papa));
      
      loadJs(playerJs, () => {
                HCPlayer({
                        papa: '#papa',
                        lrcAr: lrcAr,
                        lrc_css: ' left: 30%; top:90%;color:Honeydew; --bg: linear-gradient(rgba(0,128,128,.4),rgba(0,128,128,.7));',
                        fs_css: 'top: -1000px; background: transparent;',
                        player_css: `
                              width: 250px;
                              height: 250px;
                              right: 200px;
                              bottom: 80px;
                              background: url('') -5px 1px,
                        `,
                        path: 'm118.50001,10.23611c-45.44417,0 -82.2639,32.34392 -82.2639,72.2639s36.81973,72.2639 82.2639,72.2639s82.2639,-32.34392 82.2639,-72.2639s-36.81973,-72.2639 -82.2639,-72.2639zm-45.11246,62.76469c1.09464,-12.26738 10.68104,-20.80501 18.57572,-20.80501s17.48108,8.53763 18.57572,20.80501c0.2322,2.50593 -3.58246,3.4675 -4.94247,1.31124l-3.15124,-4.95357c-2.55416,-3.992 -6.36882,-6.29395 -10.44884,-6.29395s-7.89468,2.30195 -10.44884,6.29395l-3.15124,4.95357c-1.42635,2.15626 -5.24101,1.16555 -5.00881,-1.31124zm83.19268,35.78229c-9.45371,9.96542 -23.31916,15.6766 -38.08022,15.6766s-28.62651,-5.71118 -38.08022,-15.6766c-4.47808,-4.7496 3.6488,-10.69389 8.16005,-5.97343c7.43029,7.8383 18.31035,12.29652 29.92018,12.29652s22.48989,-4.48735 29.92018,-12.29652c4.51125,-4.72046 12.63812,1.25296 8.16005,5.97343zm2.0566,-34.47104l-3.15124,-4.95357c-2.55416,-3.992 -6.36882,-6.29395 -10.44884,-6.29395s-7.89468,2.30195 -10.44884,6.29395l-3.15124,4.95357c-1.36001,2.12712 -5.17466,1.16555 -4.94247,-1.31124c1.09464,-12.26738 10.68104,-20.80501 18.57572,-20.80501s17.48108,8.53763 18.57572,20.80501c0.19903,2.50593 -3.6488,3.4675 -5.00881,1.31124z',
                        btn: {left: 55, top: 170},
                        track: {track: 'Honeydew', prog: 'Teal'},
                        img: {play: '', pause: ''}
                });
      });
})();
</script>

liumang 发表于 2023-10-28 21:43

漂亮的视频背景{:5_150:}

小辣椒 发表于 2023-10-28 21:44

liumang 发表于 2023-10-28 21:43
漂亮的视频背景


liumang晚上好{:5_127:}

liumang 发表于 2023-10-28 21:45

歌曲好听,这个笑脸路径漂亮的{:5_150:}

小辣椒 发表于 2023-10-28 21:45

liumang 发表于 2023-10-28 21:45
歌曲好听,这个笑脸路径漂亮的

我也是套用别人代码的

liumang 发表于 2023-10-28 21:46

小辣椒 发表于 2023-10-28 21:45
我也是套用别人代码的

这个做方便吗,直接套用代码以后我也是去试试

小辣椒 发表于 2023-10-28 21:47

liumang 发表于 2023-10-28 21:46
这个做方便吗,直接套用代码以后我也是去试试

你会代码 现在就去套用,很方便的,

liumang 发表于 2023-10-28 21:48

小辣椒 发表于 2023-10-28 21:47
你会代码 现在就去套用,很方便的,
今天不做了,在听音乐,以后做了{:5_121:}

小辣椒 发表于 2023-10-28 21:49

liumang 发表于 2023-10-28 21:48
今天不做了,再听音乐,以后做了

{:5_120:}

溜了

liumang 发表于 2023-10-28 21:51

小辣椒 发表于 2023-10-28 21:49
溜了

别跑。。。。{:5_145:}
页: [1] 2
查看完整版本: 心然 - 千年缘