Examples

There are few ways to get started, from the most simple example to advanced, we support many different countdown styles, see wich one fits your scenario, and if any doesn’t the Docs are a good starting point to customize your output.

Advanced coupon site

This example handle multiple cases of the countdown, show %-w weeks and %-d days only when necessary and handle pluralization, display the time as %H:%M:%S.

View

Basic coupon site

This is the most common case to use the script, that mimic the countdown style in coupon sites like Groupon. Format the output with %D days %H:%M:%S.

View

Bootstrap

Showcases the use of the plugin within Bootstrap library, integrating together with others javascript components as well the css template.

View

Continue after finish

Configure countdown to continue after reaches its end, then the timer will start to counting up and will never stop until said so.

View

Legacy style

Assign the callback uppon initialization, format the countdown %w weeks %d days %H hours %M minutes %S seconds where each directive value is displayed within his own DOM element (<span>) and all are zero-padded.

View

Months and weeks offsets

Display the possibles days offsets %n, %d and %D regarging the months, weeks and the total amount of the days until the finish date.

View

Multiple instances on the same page

Assign the countdown on several elements at the same time.

View

Sum of total hours remaining

Display a countdown calculating all remaining hours to the final date.

View

Timezone Aware

Use MomentJS to display a countdown accordingly to the selected timezone no matter the localtime your computer is.

View

Callback style and formatter modifiers

Very similar to the legacy example, but uses the callback style instead. Format the output with blank-padded value for weeks (%-w) and days (%-d) and pluralize it’s output with %!w and %!d.

View

Fork me on GitHub