loopOut() will make your keyframes repeat. You must have at least one keyframe for it to work, otherwise, you might get an error!

loopOut();

More powerful than you think

By default, loopOut() just works, as long as your property have some keyframes.

loopOut();

‍

But let's explore some more interesting options this function gives us:

loopOut("pingpong");

‍

Pingpong will literally play your animation back and forth, So if you have a rotation keyframe with the value of 0 and another one with the value 360, using ping pong will animate between 360 and 0, then between 0 and 360, then between 360 and 0 again and so on, like a ping-pong game.

loopOut("offset");

Offset loops your keyframed animation without resetting it. This can be a little trippy so let’s start with an example:
You can keyframe a ball jumping down a single stair, then loopOut(“offset”) will make it keep going down the rest of the stairs, forever (assuming the distance between those stairs are equal).

Think of it this way: If you have a point A and a point B, a normal loopOut() would simply repeat the motion from point A to point B forever. With offset, once it reaches point B, instead of starting over it will keep going from point B to a new point, point C. Where is point C? It is where point B is to point A. The motion is adding up onto itself.

loopOut(“continue”);

Continue is funny, it behaves like shooting an object into space. Once in space, the object does not accelerate or decelerate anymore, it uses its previous momentum to keep going at the same speed.
Continue continues at the very same speed the animation ends in. It will sample the velocity right before the last keyframe and keep your animation going at that same speed forever.

There is more to loop expressions, but these are the basics.

Limitations

Loop out does not work on path keyframes.