朵拉 发表于 2025-9-4 23:32

星 月 落（学习马黑黑Still效果）

本帖最后由 朵拉 于 2025-9-5 09:30 编辑 <br /><br /><style>
        @import 'https://638183.freep.cn/638183/web/css/tz01.css';
        #pa { aspect-ratio: 3/2; z-index: 1000; --bg: url('https://pic1.imgdb.cn/item/68b9ab4758cb8da5c87e5bfc.jpg') no-repeat center/cover; --ma-size: 10%; --offsetX: 81px; }
        #ma { left: 280px; bottom: 250px; }
        #btnFs { right: 30px; top: 30px; color: #eee; }
      .title-text { right: 20px; top: 30px; font-size: 30px; writing-mode: vertical-rl; }
</style>

<div id="pa">
        <audio id="aud" src="http://lsjwldx.com/myfile/duola/xingyueluo.mp3" autoplay="" loop=""></audio>
        <video class="pd-vid" src="https://img.tukuppt.com/video_show/15653652/00/30/01/5fa35f70c94d7.mp4" autoplay loop muted></video>
      <div class="title-text">星 月 落</div>
        <div id="ma" class="sepia"><svg id="msvg" width="100%" height="100%" viewBox="-200 -200 400 400"></svg></div>
</div>

<script type="module">
        import { FS } from 'https://638183.freep.cn/638183/web/js/fullscreen.js';
        import Dr from 'https://638183.freep.cn/638183/web/mod/svgdr.js';
        var dr = Dr.dr(msvg);
        var d = 'M0 0 L-40 -190 Q0 -20,40 -190 L0 0';
        var tt = 5;
        Array.from({length: tt}).forEach((_,k) => dr.path(d, 'snow', 'beige', 4).transform(`rotate(${360/tt*k})`));
        dr.circle(0, 0, 100, 'none', 'snow', 20).style('opacity: 0.6;');
        FS(pa, ma);
</script>

朵拉 发表于 2025-9-4 23:33

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

梦江南 发表于 2025-9-5 07:44

漂亮，谢谢朵拉老师的精美音画。{:4_204:}

马黑黑 发表于 2025-9-5 11:56

{:4_199:}

小辣椒 发表于 2025-9-5 14:29

朵拉这个背景图用的好，这个作业我都没有做过，欣赏朵拉漂亮的制作

红影 发表于 2025-9-5 19:04

漂亮，欣赏朵宝好帖{:4_187:}
页: [1]
查看完整版本: 星 月 落（学习马黑黑Still效果）