一束光(学习黑师2023.7.4新粒子效果)

南无月

:doodle { @size: 260px; cursor: pointer; right: 580px; top: 220px; opacity: .96;z-index: 4; }clip-path: @shape(points: 360;frame: 18;turn: .5;scale: .08;x: 9 * cos(10t) + cos(44t);y: 9 * sin(10t) + sin(44t););background: linear-gradient(DeepSkyBlue,Orange,MediumPurple);animation: rot 6s infinite linear var(--state);@keyframes rot { to { transform: rotate(360deg); } }:doodle { @size: auto 4em; z-index:5; bottom: 10px; --geci: " css-doodle player"; --motion: cover2; --tt: 1s; }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: Sienna;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-7-4 18:37
@马黑黑 交一份今天的粒子作业。。
存在问题：不知道怎么控制粒子可以停下来

这个应该会了。粒子运动函数里，有 if(canMove) { ... }，canMove 也在前面声明了，是个布尔变量。如此，在 mState() 函数中，加入它：

let mState = () => aud.paused ? (papa.style.setProperty('--state','paused'), vid.pause(), canMove = false) : (papa.style.setProperty('--state','running'), vid.play(), canMove = true);

马黑黑

创意与设计，再到实现手段，都显得上了水平。粒子的控制，要找到入口。

南无月

小文 发表于 2023-7-4 19:00
好漂亮!喜欢

感谢小文临贴回复

南无月

路人甲 发表于 2023-7-4 19:00
欣赏

感谢路人临贴回复

南无月

小辣椒 发表于 2023-7-4 19:25
月月速度的，中午看见黑黑的教程，现在出来了，加的歌词同步好听

小辣椒好！照着贴子搜的光的歌，听起来不错就用了第一次听

南无月

小辣椒 发表于 2023-7-4 19:26
不敢多写字，怕被吃字

好哒，明白的

南无月

小辣椒 发表于 2023-7-4 19:26
月月特棒

谢谢小辣椒鼓励

南无月

醉美水芙蓉 发表于 2023-7-4 19:54
我曾遇到一束光，歌曲好听！月儿制作漂亮！

谢谢水芙蓉肯定哦

南无月

千羽 发表于 2023-7-4 20:33
进来就看到月儿的创意棒棒哒

千羽来了，过来抱个粒子作业，看这着版粒子挺漂亮就跟了一贴

南无月

千羽 发表于 2023-7-4 20:35
有诗意的亮眼画面，歌儿也好听

这首歌还不错，听起来不吵耳朵