direction()

functionsince 0.3requires runtime

Whether the last change of a number or dimension state went up, nowhere or down.

On this page · 9 sections+

Syntax Parameters Return value Example Behavior Supported contexts Limitations Examples Related

Syntax

direction(<custom-property>)

registry syntax: direction(--state)

Parameters

custom-property<dashed-ident>required: A number or dimension state.

Return value

1, 0 or -1. Unknown for other types.

Example

direction.cssreactive

.slides:changed(--index) .slide {  animation-name: when(    direction(--index) > 0,    from-right,    from-left  );}

:changed()Selector · hover any red tokenMatches briefly after an observed change of the nearest state, until the animations it started have finished.Reference →

Behavior

0 until the first change.

Supported contexts

Any value or condition.

Limitations

Numbers and dimensions only.

Examples

State history · API examples, runs the real runtime

previous():changed()State History

Experimental · syntax may change between minor versions