Tiny jQuery Countdown Timer Plugin
File Size: | 6.45KB |
---|---|
Views Total: | 5218 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
A tiny and easy-to-use jQuery plugin that allows you to create a customizable countdown timer on your web page. It also can be worked with the Moment.js (A JS Date Format & validate Library) to make date manipulation much easier.
Basic Usage:
1. Include jQuery library and jquery.tinytimer.min.js in your html document
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="jquery.tinytimer.min.js"></script>
2. Markup
<div id="timer"></div>
3. Call the plugin with custom output format
<script> var d = new Date('December 25, 2013'); $('#timer').tinyTimer({ from: d, format: '%d Days, %h Hours, %m Minutes, %s Seconds' }); </script>
4. Time Format
%d - days %h - hours %m - minutes %s - seconds
5. Example for working with Moment.js
// 30-minute countdown var m = moment().add('minutes', 30); $('#timer').tinyTimer({ to: m.toDate() }); // Hours since the beginning of the week var m = moment().startOf('week'); $('#timer').tinyTimer({ from: m.toDate(), format: '%H' });
6. Then you can style your countdown timer via CSS
Change Log:
v1.0.4 (2013-03-08)
This awesome jQuery plugin is developed by unknown. For more Advanced Usages, please check the demo page or visit the official website.