轨道加载 | wjs-css-effects

双球轨道

三球嵌套

椭圆轨道

行星轨道

关键点

轨道加载模拟行星绕恒星运动，小球沿圆形轨迹匀速旋转
外层容器做 rotate 旋转，小球放在容器边缘，随容器一起做圆周运动
使用 position: absolute + top/left 定位小球到轨道边缘位置
可通过增加多个小球并设置不同 animation-delay 形成多球追逐效果
轨道线可用透明边框或伪元素实现，不参与动画仅作为视觉参考

效果说明

小球沿圆形轨道旋转的加载动画，模拟行星绕日的运动。通过不同大小、速度、方向的小球组合，营造出富有层次感的视觉效果。这里展示 4 种变体：双球轨道、三球嵌套、椭圆轨道、行星轨道。