Countdown
A countdown gives a transition effect when a number changes from 0 through 999.
Class names
- component:
countdown
Syntax
<span class="countdown">
<span style="--value:{number};">number</span>
</span>
Rules
- The
--valueCSS variable and the text must contain a number from 0 through 999. - Use JavaScript to change the span text and the
--valueCSS variable. - Add
aria-live="polite"andaria-label="{number}". These attributes let screen readers read changes correctly.