Beautiful jQuery Countdown Timer Plugin

File Size: 13.8 KB
Views Total: 32282
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Beautiful jQuery Countdown Timer Plugin

A jQuery Countdown Timer Plugin that make it easy to create a coming soon page with a cool Countdown Timer.

How to use it :

1. Include jQuery library and countdown.js

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="js/countdown.js"></script>

2. Include the Stylesheets

<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/styles.css" />

3. Call the plugin and set the end date

<script src="js/countdown.js"></script>
<script>

$(document).ready(function(){
$("#countdown").countdown({
date: "17 august 2013 12:00:00",
format: "on"
},

function() {
// callback function
});
});

</script>

4. Markup

<div class="timer-area">
<h1>We're coming soon...</h1>
<ul id="countdown">
<li> <span class="days">00</span>
<p class="timeRefDays">days</p>
</li>
<li> <span class="hours">00</span>
<p class="timeRefHours">hours</p>
</li>
<li> <span class="minutes">00</span>
<p class="timeRefMinutes">minutes</p>
</li>
<li> <span class="seconds">00</span>
<p class="timeRefSeconds">seconds</p>
</li>
</ul>
</div>

This awesome jQuery plugin is developed by unknown. For more Advanced Usages, please check the demo page or visit the official website.