jQuery countdown timer plugins

Today we present two cool jQuery countdown timers – “The Final Countdown” and “FlipClock.js”.

The Final Countdown

A simple and HTML agnostic date countdown plugin for jQuery. All countdown styles in one.

The Final Countdown plugin
The Final Countdown plugin

The Final Countdown is a plugin tailored to be used in any layout, without any CSS/HTML dependency. The goal was to fit and mimic differents countdown styles as you see out there in coupons and auction sites.

Key features

– built-in time formatter

– pluralization support and I18n

– comprehensive documentation and support since 2011!

Basic example:

<div id="getting-started"></div>
<script type="text/javascript">
  $("#getting-started")
 .countdown("2016/01/01", function(event) {
    $(this).text(
      event.strftime('%D days %H:%M:%S')
    );
  });
</script>

Setup

You can install via bower:

bower install jquery.countdownp

or download directly:

https://github.com/hilios/jQuery.countdown/releases/download/2.1.0/jquery.countdown-2.1.0.zip

Homepage:

http://hilios.github.io/jQuery.countdown/

The second jQuery countdown timer is…

FlipClock.js

This library was created because the other solutions weren’t abstract enough to provide a deep level of customization without rewriting the code.

FlipClock.js plugin
FlipClock.js plugin

With FlipClock.js jQuery countdown timer you can:

– use as a clock OR as a clock

– use as a countdown

– use clean & dry syntax

– abstract everything into reusable objects

– and it has theming using pure CSS

Download from Git Hub:

https://github.com/objectivehtml/FlipClock

Related articles:

– date and time in JavaScript:

http://javascript-html5-tutorial.com/date-and-time-in-javascript.html

Take your time!

Share:Share on Facebook2Share on Google+1Tweet about this on TwitterShare on LinkedIn0Pin on Pinterest1