This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Anders Hedwig
Posted Jul 31 - Read on Facebook

Hey Folks, just trying to animate a clockhand which goes around the clock. BUT not with a linear animation, more with a stepped animation (every second the clockhand "clicks" one step forward).

Is this actually possible with the current state of framer.js?

11 Comments

Anders Hedwig

Oh, also how do I achieve an infinite repeat of an animation?

Stephen Crowley

Hey Anders - to do an infinite repeat of an animation use Utils.interval(time,function) time of course being how fast or slow you want the animation to execute. As for your first question.. I don't have a solution but I would think about how I would get the current position and be able to rotate and execute a function that would reposition the object. I would then use Utils.interval to execute it every second.

Anders Hedwig

Ahh nice, thx for the tip! So I iterate the rotation every second by +1 and restart my animation every second.

Andreas Wahlström

yep, like this:
line = new Layer
line.width = 10
line.originY = 1
move = -> line.rotation += 5
utils.interval(1,move)

Anders Hedwig

So easy, Love it :) Thx guys (y)

Stephen Crowley

That's it! Ha, sorry- haven't had my coffee yet.

Stephen Crowley

Mind sharing the results when you are done Anders?

Anders Hedwig

of course!!! :) Will make it available through github i think

Anders Hedwig

So "watch" out guys :D

Anders Hedwig

xD

Read the entire post on Facebook