<dy-rolling-number>
A number rolling animation component. When the value changes, each digit scrolls vertically to the new value with a blur effect during the transition. The animation starts slowly, accelerates, then decelerates at the end. Changing the value mid-animation produces a seamless continuation.
Playground
Loading...<></>
Loading...<></>
Loading...<></>
Loading...<></>
Loading...<></>
API
DuoyunRollingNumberElement
Extends TapRollingNumberElement
TapRollingNumberElement
Shadow DOM; Extends GemElement
TapRollingNumberElement Instance Properties
| Property(Attribute) | Reactive | Type |
|---|---|---|
value(value) |
Yes | number |
duration(duration) |
Yes | number |
easing(easing) |
Yes | EasingType |
maxblur(maxblur) |
Yes | number |
align(align) |
Yes | 'left' | 'right' |
TapRollingNumberElement Other
| Type | Value |
|---|---|
| Part | digit, separator |