Customizable jQuery Countdown Timer Plugin - countdownTimer
| File Size: | 508 KB |
|---|---|
| Views Total: | 7171 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Just another jQuery countdown timer plugin that counts down in seconds, minutes, hours and days to any date or a given time. Also can be used as a clock that displays current local time.
Basic Usage:
1. Load the latest version of jQuery and jQuery countdownTimer plugin in the web page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" src="jquery.countdownTimer.js"></script>
2. Create a container for the countdown timer.
<span id="demo"></span>
3. Call the plugin and specify a date & time you want to count to.
$('#demo').countdowntimer({
dateAndTime : "2017/12/25 00:00:00",
});
4. Add the following styles in your CSS file and change to your taste.
.style {
width: 100%;
font-family: sans-serif;
font-weight: bold;
border-style: solid;
}
.colorDefinition {
background: #000000;
color : #FFFFFF;
border-color: #F0068E;
}
.size_xl {
font-size: 50px;
border-width: 8px;
border-radius: 6px;
}
.size_lg {
font-size: 40px;
border-width: 7px;
border-radius: 5px;
}
.size_md {
font-size: 30px;
border-width: 5px;
border-radius: 4px;
}
.size_sm {
font-size: 20px;
border-width: 3px;
border-radius: 3px;
}
.size_xs {
font-size: 15px;
border-width: 2px;
border-radius: 2px;
}
5. Default Options.
$('#demo').countdowntimer({
hours: 0,
minutes: 0,
seconds: 60,
startDate: new Date(),
dateAndTime: new Date("1970/01/01 00:00:00"),
currentTime: false,
size: "sm",
borderColor: "#F0068E",
fontColor: "#FFFFFF",
backgroundColor: "#000000",
timeSeparator: ":",
tickInterval: 1,
timeUp: null,
expiryUrl: null,
regexpMatchFormat: null,
regexpReplaceWith: null,
pauseButton: null,
stopButton: null,
beforeExpiryTime: null,
beforeExpiryTimeFunction: null,
padZeroes: true,
displayFormat: "HMS",
labelsFormat: false,
timeZone: null
});
Change logs:
v2.0.1 (2017-10-30)
- Update.
v1.0.9 (2017-03-19)
- Adding before expiry time functionality
v1.0.8 (2015-04-19)
- update.
v1.0.6 (2015-02-09)
- update.
v1.0.5 (2014-06-09)
- update.
This awesome jQuery plugin is developed by harshen. For more Advanced Usages, please check the demo page or visit the official website.










