CSS相抵路径动画自适应路径设计

红影

马黑黑 发表于 2026-7-24 19:45
感觉它特别倒是很特别的

嗯嗯，很奇特的自适应的路径。

马黑黑

红影 发表于 2026-7-24 23:25
嗯嗯，很奇特的自适应的路径。

酱紫的

马黑黑

杨帆 发表于 2026-7-24 21:08
网查，董路乃“集大成”者，集多种身份与一身

但是没有教练证

杨帆

马黑黑 发表于 2026-7-25 21:07
但是没有教练证

是，也许他认为这个不影响他做事吧

马黑黑

杨帆 发表于 2026-7-26 11:44
是，也许他认为这个不影响他做事吧

估计吧

杨帆

马黑黑 发表于 2026-7-23 13:33
这个不因为讲的如何，原理都在那里，不论怎么讲。关键是在相关领域能入门，入了门只要用心，理解起来就不 ...

请教马老师：如何在JS中正确拼接 动态 offset-path 路径，需注意什么？

比如： offset-path: path('M 20 20 L200 160 A50 30, 0 0 1,380 80 L580 20');

马黑黑

杨帆 发表于 2026-7-27 19:41
请教马老师：如何在JS中正确拼接 动态 offset-path 路径，需注意什么？

比如： offset-path: path('M  ...

offset-path 的 path 函数，里面的内容涉及到 SVG path 路径的 d 属性，遵循 SVG path 元素基于 d 属性的赋值规范，支持 SVG 各种绘制指令，只要遵循不同的绘制指令和设置就行。这需要熟悉所有的绘制指令，简单教程或MDN或其他相关教程里的都有。然后需要注意的是：所设计的路径，应基于应用场景的尺寸，不要超出范围，例如，假设父元素的尺寸是 800*600，那么，所有指令要绘制的路径图形都不能超越这个范围，除非设计需要这么做。

杨帆

马黑黑 发表于 2026-7-27 19:56
offset-path 的 path 函数，里面的内容涉及到 SVG path 路径的 d 属性，遵循 SVG path 元素基于 d 属性的 ...

谢谢马老师答疑解惑，我再学习一下

马黑黑

杨帆 发表于 2026-7-27 20:23
谢谢马老师答疑解惑，我再学习一下

霜染枫丹

马老师晚上好！

我能力不理想，做什么事请不能分神，这几天都没有好好看帖。昨晚我看了这个帖子，从动画的实现上我用软件会做，但是软件制作的东东动画不能直接显示。从这个角度我的理解代码是数学的话，软件的使用只能是托儿所大班的算术，做好了能给个小红花。我把这几个帖子都抱走了先留存，
很感谢您的分享，祝您夏安！

马黑黑

霜染枫丹 发表于 2026-7-27 23:02
马老师晚上好！

我能力不理想，做什么事请不能分神，这几天都没有好好看帖。昨晚我看了这个帖子，从动画 ...

应用环境不同，制作方式不同，仅此而已