Animation initial values

Define the animation starting values

Use static styling to define the animation initial (or from) value. This represents a starting value. It must be defined before all others triggers. This example below use scale(0.75) property as initial value. This makes the button to scale down to 0.75. Because the TorusKit runs before the render, the button will be scaled immediately.

Shorthand initial values

You can us the shorthands properties as the initial values as well. Here is the example that shows the same behavior, but we are using the shorthand in this case.

Multiple initial values

There’s no limit to use multiple initial values. Just make sure they are defined before the triggers.

Multiple animations

When there are multiple animations (or triggers) defined, they share only one initial value for each property. Here we have two triggers (animations) - the regular animate trigger and the hover one with the initial value of r(10deg). This is common for both of the triggers.