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.