Problem with animation timing with SVG

Asked

Viewed 16 times

0

I’m trying to make an animation of SVG using very simple CSS, where stars appear within themselves infinitely. The only problem is that after the first loop one of the paths starts to go over the others, which is not the goal. I tried to look and I can’t find the error or solution. Follow her on Codepen: http://codepen.io/guilhermehff/pen/aWZrbP?editors=1100

1 answer

0

After some more time doing tests, I realized that the layers in SVG work by order of html, that is, one of them was always on top of the others, causing the original problem. To solve this, I used a clip-pathto keep the SVG within the size and changed the animationto push the boundaries, creating the effect you wanted.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.