朵拉 发表于 2023-5-7 21:03

我们都一样（马黑黑原创）

本帖最后由 朵拉 于 2023-5-7 21:08 编辑 <br /><br /><css-doodle id="mplayer">
      :doodle {
                @grid: 4 / 1024px 640px;
                background: url('https://pic2.imgdb.cn/item/6457a1e00d2dde57777e5b76.jpg') no-repeat center/cover;
                margin: -80px 0 0 calc(50% - 593px);
                box-shadow: 0 0 8px #000;
                pointer-events: none;
                --state: running;
      }
      @match(i <= 12) {
                @place-cell: 50% 15%;
                @size: calc(@i() * 12px);
                @shape: bud 10;
                border: 6px solid #@repeat(6, @p());
                pointer-events: auto;
                cursor: pointer;
                animation: rot 4s infinite linear var(--state);
      }
      @match(i > 12) {
                background: gray;
                @size: @p(40px, 80px);
                @shape: @p(whale,fish);
                @place-cell: 720px 440px;
                transform: rotate(calc((@size() - @i() + 1) * 30deg)) translate(80px);
      }
      @keyframes rot { to { transform: rotate(360deg); } }
</css-doodle>

<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2008940480" autoplay loop></audio>

<script>
(function() {
      let script = document.createElement('script');
      script.src = 'https://unpkg.com/css-doodle@0.34.8/css-doodle.min.js';
      document.head.appendChild(script);
      let mState = () => mplayer.style.setProperty('--state', aud.paused ? 'paused' : 'running');
      aud.addEventListener('play', mState, false);
      aud.addEventListener('pause', mState, false);
      mplayer.onclick = () => aud.paused ? aud.play() : aud.pause();
})();
</script>

朵拉 发表于 2023-5-7 21:09

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

竹溪 发表于 2023-5-7 21:14

好看。欣赏点赞。

红影 发表于 2023-5-7 22:36

这个做得真漂亮，欣赏朵宝好帖{:4_187:}

朵拉 发表于 2023-5-7 22:41

竹溪 发表于 2023-5-7 21:14
好看。欣赏点赞。

谢谢竹溪朋友的欣赏~~{:4_204:}

朵拉 发表于 2023-5-7 22:41

红影 发表于 2023-5-7 22:36
这个做得真漂亮，欣赏朵宝好帖

谢谢影宝的临帖，么么哒{:4_185:}

红影 发表于 2023-5-7 22:45

朵拉 发表于 2023-5-7 22:41
谢谢影宝的临帖，么么哒

朵宝真棒，这个做得特别漂亮{:4_199:}

焱鑫磊 发表于 2023-5-7 22:50

欣赏朵拉佳作！{:4_187:}

马黑黑 发表于 2023-5-7 23:23

朵拉 发表于 2023-5-7 21:09
@马黑黑
马师 晚上好，学生交作业，请指点~~

做得不错。赞。

樵歌 发表于 2023-5-8 06:49

黑暗中的希望和光明，朵儿画儿意境真好{:4_187:}

马黑黑 发表于 2023-5-8 22:54

朵宝宝学的挺快的

竹溪 发表于 2023-5-9 11:05

朵拉 发表于 2023-5-7 22:41
谢谢竹溪朋友的欣赏~~

问好朵拉。
页: [1]
查看完整版本: 我们都一样（马黑黑原创）