Jump to content
Search Community

Moving element infinitely by x pixels in y seconds

nikki tucker test
Moderator Tag

Go to solution Solved by PointC,

Recommended Posts

HI guys, i have a really easy question, sorry for that, tried to find solution but couldn't do it.

I have several rectangles with a classname of "move". When i push the green button, they should start moving to the left with a certain speed (for example, 200 pixels in 2 seconds).

I use relative translation '-=200'.

I expect to see that they start moving infinitely to the left, go from the screen to the left and continue moving to the left all the time.

But what i get is that every time the animation repeats, they all start from the beginning point.

Also I want the whole animation to be in one timeline so I can easily control it.

 

I have one timeline 'moveTl' which contains one tween.

 

In the main attached codepen I added 'repeat:-1' to the whole timeline.

 

I also tried to add 'repeat:-1' not to the timeline but to the first tween, but nothing changes.

See the Pen mdrdmyx by nikkitucker (@nikkitucker) on CodePen

 

Please help me understand why i'm getting this result and how can i get what i need?

See the Pen OJRJpqE by nikkitucker (@nikkitucker) on CodePen

Link to comment
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.
×
×
  • Create New...