花甲走四方 发表于 2026-9-10 08:45

Grant Miller - Colder Than Ice

<style>
    @import 'https://638183.freep.cn/638183/web/api/audioplayer.css';
    .pa { --offsetX: 81px; --bg: url('https://imgimg.qqdsw8.cn/view.php/b6cabe3ca2bda6676c9cc33d27824c4b.jpg') no-repeat center/cover; color: lightblue; perspective: 1000px; }
    .son { position: absolute; inset: 0; transform-style: preserve-3d; }
    .player { width: 480px; bottom: 10px; }
    .btnFs { top: 25px; right: 20px; }
    .mpic { width: 128px; height: 128px; offset-path: ellipse(30% 20% at 50% 30%); cursor: pointer; filter: drop-shadow(2px 2px 30px white); animation: offset-distance 15s linear var(--delay) infinite var(--state), move 200s linear infinite alternate var(--state);--delay: 0s; }
    .mpic:nth-of-type(2) { --delay: -3s; }
    .mpic:nth-of-type(3) { --delay: -6s; }
    .mpic:nth-of-type(4) { --delay: -9s; }
    .mpic:nth-of-type(5) { --delay: -12s; }
    @keyframes move {
      from { transform: translateZ(-3000px); }
      to { transform: translateZ(0); }
    }
</style>

<div id="pa" class="pa">
    <video class="pd-vid" src="https://img2.tukuppt.com/video_show/2269348/00/02/01/5b4eedab469ff.mp4" autoplay loop muted></video>
      <video class="pd-vid" src="https://video.shipin520.com/videos/58pic/27/88/40/29R58PICRF86JEI5MbWMe_v1.mp4" autoplay loop muted></video>
                <video class="pd-vid" src="https://imgimg.qqdsw8.cn/view.php/8d9003eb188dad1e6838207f94dcd032.webm" autoplay loop muted></video>
    <div class="son">
      <img class="mpic" src="https://638183.freep.cn/638183/small/2025/b1.webp" alt="" />
      <img class="mpic" src="https://638183.freep.cn/638183/small/2025/b2.webp" alt="" />
      <img class="mpic" src="https://638183.freep.cn/638183/small/2025/b3.webp" alt="" />
      <img class="mpic" src="https://638183.freep.cn/638183/small/2025/b4.webp" alt="" />
      <img class="mpic" src="https://638183.freep.cn/638183/small/2025/b5.webp" alt="" />
    </div>
</div>

<script>
    var pics = document.querySelectorAll('.mpic');
    var options = {
      pa: '.pa',
      urls: [['https://imgimg.qqdsw8.cn/view.php/86c2fcea0ed9d6cd73457cc72842e27d.mp3', 'Grant Miller - Colder Than Ice']],
      btns: [...pics],
    };

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

    function tzRun() {
      var aud = new AudPlayer(options);
    }

    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-9-10 10:07

高老师用黑黑老师的代码制作得很精彩。为高老师点赞！{:4_199:}

红影 发表于 2026-9-10 22:08

漂亮的制作，欣赏高老师好帖{:4_199:}
页: [1]
查看完整版本: Grant Miller - Colder Than Ice