Countdown
@@adsense
Declarative style
<div class="countdown" data-role="countdown"></div>
JavaScript style
<div class="countdown" id="countdown"></div>
<script>
$(function(){
$("#countdown").countdown();
});
</script>
Options
| Parameter |
Data-* |
Type |
Default value |
Description |
| stop |
data-stop |
stringify date |
false (current datetime) |
Stop time |
| days |
data-days |
int |
false |
Days to stop |
| hours |
data-hours |
int |
false |
Hours to stop |
| minutes |
data-minutes |
int |
false |
Minutes to stop |
| seconds |
data-seconds |
int |
false |
Seconds to stop |
| backgroundColor |
data-background-color |
string |
bg-cyan |
Digit background. Color or class |
| digitColor |
data-digit-color |
string |
fg-white |
Digit color. Color or class |
| dividerColor |
data-divider-color |
string |
fg-dark |
Divider color. Color or class |
| labelColor |
data-label-color |
string |
fg-grayLight |
Labels color. Color or class |
| labels |
data-labels |
object |
{'days': 'days', 'hours': 'hours', 'minutes': 'minutes', 'seconds': 'seconds'} |
Label values |
Events
| Event |
Data-* |
Params |
Description |
| onTick |
data-on-tick |
(d, h, m, s) |
The event fired when the countdown ticked |
| onStop |
data-on-stop |
|
The event fired when the countdown stopped |
@@hit