javascript - 移动时在 div 之后创建虚线 "trail"

Question

我对这个 demo 中使用的菜单进行了重大修改。 :

当较小的圆圈呈扇形展开时，我想在中央主元素和较小的外圈之间放置多个小“点”，这将形成一条连接这两个元素的虚线。

它会产生与此类似的效果，但会以放射状图案多次出现(橙色圆圈):

动态完成此操作的最佳方法是什么？

Answer 1

我创建了 a sample带有您需要的动画。这是如何完成的:

创建带有径向渐变背景的橙色点并重复:

background: radial-gradient(circle, orange 5px, transparent 5px) 15px 0;
background-size: 20px 10px;

旋转元素:

transform: rotate(-45deg);
transform-origin: 0 0;

当后圈飞出时，改变元素宽度，使用transition使其平滑。在我的示例中，我使用了动画，但没有太大区别。

transition: width 2s;