Simple.Animation.Property

Animatable Properties specify what your animation should look like at each point in an animation.

type alias Property =

Property

An animatable property.

Common Properties

These properties will give you smooth and performant animations.

opacity : Float -> Property

Animate the opacity of an element (a value between 0 and 1).

Move, Rotate and resize elements.

rotate : Float -> Property

scale : Float -> Property

scaleXY : Float -> Float -> Property

y : Float -> Property

x : Float -> Property

xy : Float -> Float -> Property

color : String -> Property

backgroundColor : String -> Property

borderColor : String -> Property

Animate any CSS property:

P.property "stroke-dasharray" "10"

Take care with properties that are not hardware accelerated as they may result in janky animations.

property : String -> String -> Property