论坛 › 欢乐水吧 › 四季欢歌（学习黑黑老师烟雾云台代码）

梦江南 发表于 2026-8-13 10:18

四季欢歌（学习黑黑老师烟雾云台代码）

<style>
    @import 'https://638183.freep.cn/638183/web/api/audioplayer.css';
    .pa { --offsetX: 81px; --bg: url('https://pan.suyanw.cn/view.php/0e156fee2d153104a1fab6c332147305.jpg') no-repeat center/cover; color: lightgreen;border-radius:32px; }
    .player { width: 480px; bottom: 10px; }
    .btnFs { top: 25px; right: 20px; }
    #player1 { position: absolute; top: 30px; width: 28%; height: 15%; overflow: hidden; }
    .mpic { position: absolute; left: 0; height: 100%; white-space: nowrap; animation: move 50s linear infinite var(--state); }
    .mpic img { height: 100%; height: 100%; aspect-ratio: 1/1; border-radius: 50%; opacity: 0.5; transition: 1s; cursor: pointer; }
    .mpic img:hover { opacity: 1; }
    @keyframes move { to { transform: translateX(-50%); } }
</style>

<div id="pa" class="pa">
    <video class="pd-vid" src="https://pan.suyanw.cn/view.php/6bffc0e5916245c6988542c06ca7a81e.mp4" autoplay loop muted></video>
    <div id="player1">
      <div class="mpic">
            <img src="https://pan.suyanw.cn/view.php/1d7f2b72d949edb14c17d9993498b8d0.jpg" load="lazy" alt="" />
            <img src="https://pan.suyanw.cn/view.php/1a5e859bfd48a0cf4d8f11e8c53ee024.jpg" load="lazy" alt="" />
            <img src="https://pan.suyanw.cn/view.php/1f9264f2b5e6bedebaaf012c5d2e55de.jpg" load="lazy" alt="" />
            <img src="https://pan.suyanw.cn/view.php/dd2f1600e795f68f4ab55b49eaea8943.jpg" load="lazy" alt="" />
            <img src="https://pan.suyanw.cn/view.php/1d7f2b72d949edb14c17d9993498b8d0.jpg" load="lazy" alt="" />
            <img src="https://pan.suyanw.cn/view.php/1a5e859bfd48a0cf4d8f11e8c53ee024.jpg" load="lazy" alt="" />
            <img src="https://pan.suyanw.cn/view.php/1f9264f2b5e6bedebaaf012c5d2e55de.jpg" load="lazy" alt="" />
            <img src="https://pan.suyanw.cn/view.php/dd2f1600e795f68f4ab55b49eaea8943.jpg" load="lazy" alt="" />
      </div>
    </div>
</div>

<script>
    var options = {
      pa: '.pa',
      urls: [['https://pan.suyanw.cn/view.php/9b101f2958db31711040f456ca2a2541.mp3', '四季欢歌']],
    };

    loadJs('https://638183.freep.cn/638183/web/api/audioplayer.min.js', tzRun);

    function tzRun() {
      var aud = new AudPlayer(options);
      const pics = document.querySelectorAll('.mpic img');
      pics.forEach(pic => {
            pic.title = '更换背景';
            pic.onclick = () => aud.pa.style.backgroundImage = `url(${pic.src})`;
      });
    }

    function loadJs(url, callback) {
      var script = document.createElement('script');
      script.charset = 'utf-8';
      script.src = url;
      script.onload = function() {
            if (callback) callback();
      };
      document.head.appendChild(script);
    }
</script>

玫瑰 发表于 2026-8-13 10:28

精美佳作，江南上午好{:4_204:}

梦江南 发表于 2026-8-13 10:30

玫瑰 发表于 2026-8-13 10:28
精美佳作，江南上午好

玫瑰上午好{:4_204:}

梦江南 发表于 2026-8-13 10:31

玫瑰 发表于 2026-8-13 10:28
精美佳作，江南上午好

谢谢玫瑰欣赏，祝好！{:4_171:}

玫瑰 发表于 2026-8-13 10:35

美的画卷，美的欣赏。{:4_204:}

梦江南 发表于 2026-8-13 10:37

玫瑰 发表于 2026-8-13 10:35
美的画卷，美的欣赏。

谢谢玫瑰分享{:4_180:}

夕阳黄昏 发表于 2026-8-13 10:47

欣赏，赞！

梦江南 发表于 2026-8-13 10:58

夕阳黄昏 发表于 2026-8-13 10:47
欣赏，赞！

问好黄昏老师，这个首歌是用AI作曲、作词的，谢谢欣赏支持。{:4_204:}

梦油 发表于 2026-8-13 11:11

欣赏江南精美制作，祝福江南天天快乐。

梦江南 发表于 2026-8-13 11:26

梦油 发表于 2026-8-13 11:11
欣赏江南精美制作，祝福江南天天快乐。

问好梦油，谢谢欣赏支持，祝秋日安康！{:4_204:}

夕阳黄昏 发表于 2026-8-13 12:20

梦江南 发表于 2026-8-13 10:58
问好黄昏老师，这个首歌是用AI作曲、作词的，谢谢欣赏支持。

学不会， 见AI我就绕道{:5_102:}

梦江南 发表于 2026-8-13 12:48

夕阳黄昏 发表于 2026-8-13 12:20
学不会， 见AI我就绕道

真的啊，你这么做代码，AI学会快学精也是难的。

夕阳黄昏 发表于 2026-8-13 12:51

梦江南 发表于 2026-8-13 12:48
真的啊，你这么做代码，AI学会快学精也是难的。

现在什么都学不进{:5_102:}

小辣椒 发表于 2026-8-13 12:54

漂亮~~黑黑这个代码我也是套用玩过一次，欣赏阿姨好制作{:4_178:}

梦江南 发表于 2026-8-13 13:32

夕阳黄昏 发表于 2026-8-13 12:51
现在什么都学不进

你的代码不是学得很精的吗。{:4_173:}

梦江南 发表于 2026-8-13 13:33

小辣椒 发表于 2026-8-13 12:54
漂亮~~黑黑这个代码我也是套用玩过一次，欣赏阿姨好制作

小辣椒，今天中午不休息上来顶帖，辛苦了。{:4_183:}

小辣椒 发表于 2026-8-13 13:38

梦江南 发表于 2026-8-13 13:33
小辣椒，今天中午不休息上来顶帖，辛苦了。

阿姨我准备下了，晚上见了，今天晚上可能会上来{:4_179:}

梦江南 发表于 2026-8-13 13:47

小辣椒 发表于 2026-8-13 13:38
阿姨我准备下了，晚上见了，今天晚上可能会上来

好的，你早点下去，晚上见。{:4_179:}

夕阳黄昏 发表于 2026-8-13 15:12

梦江南 发表于 2026-8-13 13:32
你的代码不是学得很精的吗。

原先有点相关基础

梦江南 发表于 2026-8-13 15:15

夕阳黄昏 发表于 2026-8-13 15:12
原先有点相关基础

是职业关系吗？

查看完整版本: 四季欢歌（学习黑黑老师烟雾云台代码）