motionsites中文站 / 加载动画 · Moody Dingo
加载动画 · Moody Dingo
aadmin2026-09-19 发布组件0 阅读

加载动画 · Moody Dingo

类型:组件 · 分类:加载动画 · 收录:2026-09-19 · 源码:会员可见

[hidecontent type="vip1"]
<svg height="0" width="0">
    <defs>
        <filter color-interpolation-filters="sRGB" height="200%" y="-50%" width="200%" x="-50%" id="goo">
            <feGaussianBlur result="blur" stdDeviation="8" in="SourceGraphic"></feGaussianBlur>
            <feColorMatrix result="cm" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 21 -7" mode="matrix" in="blur"></feColorMatrix>
        </filter>
    </defs>
</svg>

<svg height="180" width="320" viewBox="0 0 320 180">
    <g filter="url(#goo)">
        <circle cy="90" cx="160" r="24" fill="#275EFE" class="circle"></circle>
        <circle cy="90" cx="160" r="24" fill="#275EFE" class="circle right"></circle>
    </g>
</svg>
<style>
/* From Uiverse.io by Nawsome - Tags: loader */
.circle {
  animation: move571 4s linear infinite;
}

.circle.right {
  animation-direction: reverse;
}

@keyframes move571 {
  25% {
    transform: translateX(-32px);
  }

  75% {
    transform: translateX(32px);
  }
}
</style>
[/hidecontent]
← 返回首页