朵拉 发表于 2024-1-21 23:02

飞天茅台 TO：澜天&平凡

<style>
#mydiv {
      margin: 0 0 0 calc(50% - 593px);
      width: 1024px;
      height: 644px;
      background: url('https://pic.imgdb.cn/item/653bac3dc458853aef298da4.jpg') no-repeat center bottom;
      box-shadow: 4px 4px 8px rgba(0,0,0,.75);
      overflow: hidden;
      position: relative;
      display: grid;
      place-items: center;
}
#mydiv::before {
      position: absolute;
      content: '';
      width: 100%;
      height: 16%;
      bottom: 1px;
      background: inherit;
      filter: url(#turb);
}
#mydiv > svg { stroke-linecap: round; }
.myfilter { position: absolute; width: 0; height: 0; }
</style>

<div id="mydiv"></div>
<svg class="myfilter">
    <filter id="turb" filterUnits="objectBoundingBox" x="0" y="0" width="100%" height="100%">
      <feTurbulence id="feturbulence" type="fractalNoise" numOctaves="3" seed="2"></feTurbulence>
      <feDisplacementMap xChannelSelector="G" yChannelSelector="B" scale="20" in="SourceGraphic"></feDisplacementMap>
    </filter>
</svg>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2100558978" autoplay loop></audio>

<script>

(function() {
      let frames = 0, rad = Math.PI / 180;

      let lrcAr = [ ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ];
      let js1 = 'https://638183.freep.cn/638183/web/api/svg_path_lrc.js',
                js2 = 'https://638183.freep.cn/638183/web/lizi/h5lz_2d.js';
      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();
      };
      loadJs(js1, () => {
                HCPlayer({
                        papa: '#mydiv',
                        lrcAr: lrcAr,
                        lrc_css: 'top: 20px;',
                        fs_css: 'left: -200px; background: transparent;',
                        player_css: 'width: 200px; height: 200px; left: 2px; bottom: 2px; background: url("https://638183.freep.cn/638183/t23/btn/hshx.png") no-repeat 35px 35px',
                        path: 'M 100 5 Q 0 50, 100 100 T 195 100',
                        btn: {left: 60, top: 40},
                        track: {track: 'silver', prog: 'snow'},
                        img: {play: '', pause: ''}
                });
      });

      loadJs(js2, () => {
                H5lz({
                        papa: '#mydiv',
                        total: 60,
                        size: {width: 4, height: 4},
                        shape: {background: '#258', borderRadius: ''},
                        ani: 'toBottom',
                        maxTime: 30,
                        offset: {x: -80, y: 0},
                });
      });

      let fewave = () => {
                let bfx = 0.01, bfy = 0.1;
                frames += 0.5;
                bfx += 0.002 * Math.cos(frames * rad);
                bfy += 0.02 * Math.sin(frames * rad);
                bf = ;
                feturbulence.setAttributeNS(null, 'baseFrequency',bf.join(' '));
                requestAnimationFrame(fewave);
      };

      fewave();

})();

</script>

朵拉 发表于 2024-1-21 23:05

@澜天
感谢澜天版主的欣赏，快过年了 飞天茅台赠予您哈

朵拉 发表于 2024-1-21 23:06

@平凡
感谢平凡老师的欣赏，快过年了 飞天茅台赠予您哈

雾桥 发表于 2024-1-22 00:39

哈哈，这个好可爱

阳光痕迹 发表于 2024-1-22 06:25

哦哦，多谢小朵拉的茅台

平凡 发表于 2024-1-22 12:01

哇，这小茅台真可爱

平凡 发表于 2024-1-22 12:08

朵拉 发表于 2024-1-21 23:06
@平凡
感谢平凡老师的欣赏，快过年了 飞天茅台赠予您哈

虽然不会喝酒，还是要感谢朵拉的可爱小茅台

澜天 发表于 2024-1-22 12:50

朵拉 发表于 2024-1-21 23:05
@澜天
感谢澜天版主的欣赏，快过年了 飞天茅台赠予您哈

谢谢小朵拉
谢谢你的好酒
也谢谢你的好歌
有了你的帖子
这个版面可就充满青春和热情了
{:1_292:}

澜天 发表于 2024-1-22 12:56

还有几句上海话的

澜天 发表于 2024-1-22 12:57

这气氛好热闹
就是要过年的节奏啊

页: [1] 2
查看完整版本: 飞天茅台 TO：澜天&平凡