<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg"> <path fill="none" stroke="skyblue" d="m 20 50 c 0 -100 160 100 160 0 c 0 -100 -160 100 -160 0 z" /> <circle r="5" fill="red"> <animateMotion dur="10s" repeatCount="indefinite" path="m 20 50 c 0 -100 160 100 160 0 c 0 -100 -160 100 -160 0 z" /> </circle> </svg>
반응형
'svg' 카테고리의 다른 글
svg textPath animation (0) | 2023.09.01 |
---|---|
svg animateTransform example (0) | 2023.09.01 |
svg textPath example 1 (0) | 2023.08.31 |
how to use svg pattern (0) | 2023.08.29 |
svg pattern 2 (0) | 2023.08.27 |