亦是金 发表于 2023-10-22 13:34

《我 多 想》 - 鸡蛋面乐队(试帖黑黑老师水波效果代码)

本帖最后由 亦是金 于 2023-10-22 14:40 编辑 <br /><br /><meta charset="UTF-8">
<div class="t_fsz">
<table cellspacing="0" cellpadding="0"><tr><td class="t_f" id="postmessage_1969237">

<div style="width: 1200px;height: 700px;box-shadow:0px 0px 1px 2px #045768, 0px 0px 0px 8px #99e5f5,0px 0px 5px 15px #045768;overflow:hidden;border-radius:1%;margin-top:100px;margin-LEFT: -310px;">

<style>
#papa { margin: auto; width: 1200px; height: 700px;top: -80px;left: 0px; background: url('https://ysj147.s3-us-east-1.ossfiles.com/zzsc/gif/231022b.gif') no-repeat center/cover; box-shadow: 4px 4px 8px black; overflow: hidden; display: grid; place-items: center; z-index: 1; position: relative; --state: running; }

</style>


<style type="text/css">

@keyframes mv { from { background-position: 1200px 0; } to { background-position: 0 0; } }

body { overflow-x: hidden; }
#baiBox {
      margin: auto;
      width: 800px;
      text-align: center;
      font-family:微软简中圆;
      font-size: 2.5rem;
      font-weight: bold;
      color: #f46ff6;
      transform-origin: top;
      animation: yao 1.0s linear infinite alternate;
}

@keyframes yao {
      from{transform: perspective(800px) rotatex(30deg); }
      to { transform: perspective(800px) rotatex(-30deg); }
}



.tit { position: relative;width: 300px;height: 30px;top: 10px;LEFT: -350px;z-index: 100;filter: drop-shadow(-1px 1px 1px #ffffff)drop-shadow(0px -1px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff) }
#tit:hover { color: green; }

</style>

<div id="hu" >
<div id="baiBox"
<div class="tit">
<span style="color:#fb52f9;"><span style="font-size:30px;">《我 多 想》 </span>
<span style="color:#3d46f7;"><span style="font-size:22px;"> - - 鸡蛋面乐队</span></div>
</style>

<div style="position: relative; width: 500px; height: 50px; top:610px;LEFT: 1000px;z-index: 100; filter: drop-shadow(-1px 1px 1px #e8f552)drop-shadow(0px -1px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)">
<p><span style="color:#ff0000;"><span style="font-family:华文隶书;"><span style="font-size:24px;">亦是金在线音乐</span></span></span></p></div>

<div id="papa"></div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1468851810.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',
                playerJs1 = 'https://638183.freep.cn/638183/web/api/svg_path_lrc.js';
                      js2 = 'https://638183.freep.cn/638183/web/lizi/h5lz_02.js';

let lrcAr = [
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
       
];
        loadJs(rippleJs, () => rippleEffect(papa));
       
        loadJs(playerJs1, () => {
                HCPlayer({
                        papa: '#papa',
                        lrcAr: lrcAr,
                        lrc_css: 'bottom: 30px; --bg: linear-gradient(rgba(255,140,240,.35),rgba(250,90,220,.7)); color: #eee;',
                        fs_css: 'top: 50px; right: 50px;background: transparent;',
                        player_css: `
                                width: 250px;
                                height: 200px;
                                right: 50px;
                                bottom: 40px;
                                background: url('https://ysj147.s3-us-east-1.ossfiles.com/zzsc/png/anniu11.png') -5px 1px,
                        `,
                        path: 'm140.68635,45.38454c-16.99951,0 -32.00537,8.59228 -41.23041,21.72955c-9.21074,-13.13726 -24.22376,-21.72955 -41.23041,-21.72955c-28.03954,0 -50.76985,23.28114 -50.76985,52.00015c0,28.71901 22.73032,52.00015 50.76985,52.00015c16.99951,0 32.01252,-8.5996 41.23041,-21.73687c9.21789,13.13726 24.2309,21.73687 41.23041,21.73687c28.04668,0 50.76985,-23.28845 50.76985,-52.00015c0,-28.72633 -22.73032,-52.00015 -50.76985,-52.00015z',
                        btn: {left: 34, top: 80},
                        track: {track: '#50c6f7', prog: '#f973e5'},
                        img: {play: '', pause: ''}
                });
        });



      loadJs(js2, () => {
                H5lz({
                        papa: '#papa ',
                        total: 7,
                        size: {width: 34, height: 42},
                        shape: {background: 'url("https://www.huachaowang.com/static/image/smiley/hcbiaoqing2/105.gif") no-repeat center/cover', borderRadius: '0'},
                        ani: 'toBottom',
                        maxTime: 20,
                        offset: {x: -60, y: 0},
                          
                });
      });

})();

</script>

</td></tr></table>

红影 发表于 2023-10-22 15:23

亦是金老师真快啊,点击有波纹效果{:4_199:}

红影 发表于 2023-10-22 15:25

又是一个新的进度条路径。漂亮{:4_187:}

亦是金 发表于 2023-10-22 17:00

红影 发表于 2023-10-22 15:23
亦是金老师真快啊,点击有波纹效果

问好!{:4_187:}

红影 发表于 2023-10-22 17:01

亦是金 发表于 2023-10-22 17:00
问好!

问好亦是金老师,下午好{:4_187:}

亦是金 发表于 2023-10-22 17:02

红影 发表于 2023-10-22 15:25
又是一个新的进度条路径。漂亮

我是赶进度,尝鲜!{:4_189:}

马黑黑 发表于 2023-10-22 19:39

这是张鑫旭大佬的插件,它很完美,就是对资源的消耗比较大,如果还有第三方的资源,它的运行会受到影响。

红影 发表于 2023-10-22 19:58

亦是金 发表于 2023-10-22 17:02
我是赶进度,尝鲜!

挺好的,底图中那些动态也很可爱{:4_187:}

醉美水芙蓉 发表于 2023-10-22 20:00

亦是金 发表于 2023-10-22 20:17

马黑黑 发表于 2023-10-22 19:39
这是张鑫旭大佬的插件,它很完美,就是对资源的消耗比较大,如果还有第三方的资源,它的运行会受到影响。

问好老师!谢谢你分享水波效果插件!{:4_176:}

亦是金 发表于 2023-10-22 20:18

红影 发表于 2023-10-22 19:58
挺好的,底图中那些动态也很可爱

问好!谢谢点评!{:4_187:}

亦是金 发表于 2023-10-22 20:19

醉美水芙蓉 发表于 2023-10-22 20:00
又是一个新效果!真漂亮!谢谢老师分享!

问好水芙蓉!谢谢欣赏!{:4_187:}

红影 发表于 2023-10-22 21:03

亦是金 发表于 2023-10-22 20:18
问好!谢谢点评!

不客气啊,问好亦是金老师,晚上好{:4_187:}

马黑黑 发表于 2023-10-22 22:02

亦是金 发表于 2023-10-22 20:17
问好老师!谢谢你分享水波效果插件!

要谢应谢大佬

亦是金 发表于 2023-10-22 22:55

马黑黑 发表于 2023-10-22 22:02
要谢应谢大佬

谢大佬,也应谢老师!没有你的分享我们就不知道有这样的好东东!{:4_176:}

亦是金 发表于 2023-10-22 22:56

红影 发表于 2023-10-22 21:03
不客气啊,问好亦是金老师,晚上好

晚上好!{:4_187:}

红影 发表于 2023-10-22 23:50

亦是金 发表于 2023-10-22 22:56
晚上好!

看得笑,亦是金老师最近的几个帖子都是鸡蛋面乐队鸡蛋面乐队的,这个乐队的名称好玩{:4_173:}

亦是金 发表于 2023-10-23 09:57

问好红影!我去看看有没有其他面!{:4_189:}

马黑黑 发表于 2023-10-23 11:31

亦是金 发表于 2023-10-22 22:55
谢大佬,也应谢老师!没有你的分享我们就不知道有这样的好东东!

额,一般来说,有人介绍会好一些,没人介绍也许还真不一定能碰上

冬天的雨 发表于 2023-10-23 12:54

这路径2个圆大小一致,一模一样,双胞胎的效果{:4_170:}
页: [1] 2
查看完整版本: 《我 多 想》 - 鸡蛋面乐队(试帖黑黑老师水波效果代码)