Elements:Counters
Add nice counters and countdown timers.
Counters
Simply add an data-toggle="count-to" data-to="NUMBER-TO" data-from="NUMBER-FROM" attribute to any element.
0
0
Count Up
View code example0
0
Count Down
View code example5088767
5088767
Timers
Simply add an data-countdown="DATE-TO-COUNTDOWN-TO" attribute to any element.
2018 starts in:
2018 starts in:
Timer Format
By passing a data-countdown-format='DATE-FORMAT' you can control the output of the timer, you can even include HTML.
2018 starts in time.
2018 starts in time.
Formats
| Directive (01, 02, 03, .., 10) | Blank-padded (1, 2, 3, .., 10) | Description |
|---|---|---|
%Y |
%-Y |
Years left * |
%m |
%-m |
Months left * |
%n |
%-n |
Days left until the next complete month * |
%w |
%-w |
Weeks left |
%W |
%-W |
Weeks left until the next complete month * |
%d |
%-d |
Days left (taking away weeks) |
%H |
%-H |
Hours left |
%M |
%-M |
Minutes left |
%S |
%-S |
Seconds left |
%D |
%-D |
Total count of days till the end |
%I |
%-I |
Total count of hours thill the end |
%N |
%-N |
Total count of minutes till the end |
%T |
%-T |
Total count of seconds till the end |
Plurals
| Directive | Description |
|---|---|
%!H |
Return s when the hour is different than 1 |
%!S:plural; |
Return plural when seconds if different than 1 |
%!d:singular,plural; |
Return singular when day is 1 and plural otherwise |