水族世界（学习黑师《海》小鱼路径效果）

南无月

:doodle {@size: 1024px 640px; cursor: pointer; z-index: 4;linear-gradient(blue,green);background-blend-mode: lighten;}@match(@i ≤ @size - 1) {@size: @r(50,100)px;@shape: @p(fish, whale);background: rgba(@m3(@r(255)), .9);position: absolute;offset-path: path('M@r(200) @r(200), L@r(800,1000) @r(300), L@r(400,550) @r(500,640) Z');:after {content: '';position: absolute;right: 10px;width: 10px;height: 10px;border-radius: 50%;background: radial-gradient(black,snow);}animation: swim @r(10,30)s @r(-10, 0)s infinite ease-in-out var(--state);}@nth(@size) { clip-path: @shape( points: 480;scale: .3;move: 0 .35;x: sin(t) + sin(6t) + tan.sin(2t);y: cos(t) + cos(5t) + tan.cos(8t); ); @size: 100px;@place: center 90%;background: rgba(0,139,139,.65);cursor: pointer;animation: rot 5s infinite linear var(--state);}@keyframes swim { to { offset-distance: 100%; } }@keyframes rot { to { transform: rotate(360deg); } } :doodle { @size: auto 4em; z-index:5; top: 10px; --geci: "css-doodle player"; --motion: cover2; --tt: 1s; } /* 单元格两个伪元素显示lrc歌词 */ display: grid; place-items: center start; :before, :after { content: var(--geci); color: Honeydew; /* 歌词底色 */ font: bold 2em sans-serif; text-shadow: 1px 1px 2px #000; white-space: pre; } :after { position: absolute; width: 0; color:Teal; /* 同步歌词颜色 */ overflow: hidden; animation: var(--motion) var(--tt) linear forwards var(--state); } @keyframes cover1 { from { width: 0; } to { width: 100%; } } @keyframes cover2 { from { width: 0; } to { width: 100%; } }

马黑黑

这个有歌词同步，还有其他物种，漂亮

小辣椒

背景视频手机看不见，但你有背景图可以看见的

小辣椒

感觉你是某人，风格像的

小辣椒

很喜欢的一首歌

小辣椒

电脑欣赏效果一定更加好

南无月

马黑黑 发表于 2023-5-24 22:12
这个有歌词同步，还有其他物种，漂亮

都是鱼，金鱼

南无月

小辣椒 发表于 2023-5-24 22:19
背景视频手机看不见，但你有背景图可以看见的

嗯嗯，电脑时再看，小辣椒眼睛好些没

南无月

小辣椒 发表于 2023-5-24 22:19
感觉你是某人，风格像的

感觉错不了

南无月

小辣椒 发表于 2023-5-24 22:22
很喜欢的一首歌

哈哈，懒人借用

南无月

小辣椒 发表于 2023-5-24 22:22
电脑欣赏效果一定更加好

抄的作业，没改啥

小辣椒

南无月 发表于 2023-5-24 22:40
嗯嗯，电脑时再看，小辣椒眼睛好些没

一下子好不了

小辣椒

南无月 发表于 2023-5-24 22:41
抄的作业，没改啥

现在我连超作业都不敢玩的，总要修改一自己的东西，眼睛好糊的，否则只能照搬

马黑黑

南无月 发表于 2023-5-24 22:39
都是鱼，金鱼

对对对，金贵的鱼儿

南无月

小辣椒 发表于 2023-5-24 22:42
一下子好不了

还得休养

南无月

小辣椒 发表于 2023-5-24 22:44
现在我连超作业都不敢玩的，总要修改一自己的东西，眼睛好糊的，否则只能照搬

哈哈，我都是搬搬，也开心

南无月

醉美水芙蓉 发表于 2023-5-24 22:47
早就想请你做这个播放器了，真棒！

做了，20号做的

南无月

马黑黑 发表于 2023-5-24 22:48
对对对，金贵的鱼儿

被我转得晕头晕脑的金鱼

马黑黑

南无月 发表于 2023-5-24 22:53
被我转得晕头晕脑的金鱼

好像是在寻找出路的样纸