Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

Move ball by zigzag line

Recommended Posts

Hi everyone

Sorry, my english is not good.

I'm trying to move the ball by zig zag line. I can't set the ball in the middle of a straight line and move it to the end point.





See the Pen MWbgrPo by qhvic90 (@qhvic90) on CodePen

Link to post
Share on other sites


Hey @huytran - welcome to the forums.


What you are experiencing is related to your path not being a single path stroke but forming an enclosed shape.


You can see what I mean in the pen below if you change your fill to none, make the stroke a bit thicker and add a stroke-color.

(I left it in the background for you to see what I mean)


If you want it like in your pictures, you should make sure that your path is set up correctly.


Something like this:


See the Pen 820becb396cb470a2c317239fe474d2f by akapowl (@akapowl) on CodePen




SVG-Grandmaster @PointC has some neat articles about SVG-asset preparation on his training site.

I'll link to a thread, where he listed some of those. Could be helpful for you :) 



  • Like 5
Link to post
Share on other sites

Thanks so much.

Exactly what I was looking for.

  • Like 1
Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.