朵拉 发表于 2023-11-17 20:48

青 花(马黑黑原创)TO:亦是金

本帖最后由 朵拉 于 2023-11-17 21:15 编辑 <br /><br /><style>
#papa { margin: 0 0 0 calc(50% - 593px); width: 1024px; height: 640px; background: url('https://pic.imgdb.cn/item/6557616bc458853aefb06e43.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; overflow: hidden; z-index: 1; position: relative; display: grid; place-items: center; }
#papa::before { position: absolute; content: ''; width: 200px; height: 200px; right: 100px; bottom: 40px; background: url('data:image/svg+xml;charset=utf-8,<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"><path d="M110.00 100.00 147.50 182.27 95.00 108.66 5.00 100.00 95.00 91.34 147.50 17.73z" fill="red" /></svg>'); animation: rot 8s infinite linear var(--state); }
@keyframes rot { to { transform: rotate(1turn); } }
</style>

<div id="papa"></div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=189602" 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 playerJs = 'https://638183.freep.cn/638183/web/api/svg_path_lrc.js';
    let lrcAr = [,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ,
        ];
   
    loadJs(playerJs, () => {
      HCPlayer({
            papa: '#papa',
            lrcAr: lrcAr,
            lrc_css: 'top: 20px;',
            fs_css: 'top: -1000px; background: transparent;',
            player_css: `
                width: 200px;
                height: 200px;
                right: 100px;
                bottom: 40px;
            `,
            path: 'M170.00 100.00 189.27 132.49 153.62 145.00 147.50 182.27 112.16 168.94 83.50 193.56 65.00 160.62 27.23 161.06 34.22 123.94 5.00 100.00 34.22 76.06 27.23 38.94 65.00 39.38 83.50 6.44 112.16 31.06 147.50 17.73 153.62 55.00 189.27 67.51z',
            btn: {left: 34, top: 80},
            track: {track: 'silver', prog: 'snow'},
            img: {play: '', pause: ''}
      });
    });
})();
</script>

朵拉 发表于 2023-11-17 21:02

@马黑黑
马师 晚上好,学生交作业,请指正哈{:4_190:}

朵拉 发表于 2023-11-17 21:17

@亦是金
感谢亦是金老师的重新编辑,很漂亮哈{:4_190:}

冬天的雨 发表于 2023-11-17 21:23

欣赏朵拉的马老师的双路径制作,冬天还没有做过的

你是直接套用代码,效果没有修改过的?

冬天的雨 发表于 2023-11-17 21:24

歌曲好听的{:4_208:}

朵拉 发表于 2023-11-17 21:28

冬天的雨 发表于 2023-11-17 21:23
欣赏朵拉的马老师的双路径制作,冬天还没有做过的

你是直接套用代码,效果没有修改过的?

学生手机编辑不方便,目前直接用代码{:5_111:}{:5_111:}

马黑黑 发表于 2023-11-17 21:35

朵拉 发表于 2023-11-17 21:02
@马黑黑
马师 晚上好,学生交作业,请指正哈

漂亮

冬天的雨 发表于 2023-11-17 21:39

朵拉 发表于 2023-11-17 21:28
学生手机编辑不方便,目前直接用代码

朵拉很棒,手机编辑,特别歌词同步也是编辑了,佩服的{:4_199:}

红影 发表于 2023-11-17 21:41

好听的歌儿,漂亮的制作。欣赏朵宝好帖{:4_204:}

亦是金 发表于 2023-11-18 12:08

朵拉 发表于 2023-11-17 21:17
@亦是金
感谢亦是金老师的重新编辑,很漂亮哈

问好朵拉!帖子制作漂亮,欣赏学习了!{:4_187:}
页: [1]
查看完整版本: 青 花(马黑黑原创)TO:亦是金