Quick Start
Include jQuery, the plugin files, and initialize:
<!-- Include CSS -->
<link rel="stylesheet" href="css/countdown-plugin.css">
<!-- Your countdown container -->
<div id="myCountdown"></div>
<!-- Include jQuery and Plugin -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="js/countdown-plugin.js"></script>
<!-- Initialize -->
<script>
$('#myCountdown').ultraCountdown({
targetDate: '2025-12-31 23:59:59',
theme: 'flip'
});
</script>
Options
| Option | Type | Default | Description |
|---|
targetDate | string/Date | null | The target date to countdown to |
theme | string | 'default' | Theme name (flip, circle, glass, etc.) |
evergreen | boolean | false | Enable cookie-based evergreen timer |
evergreenHours | number | 24 | Hours for evergreen countdown |
showLabels | boolean | true | Show/hide time unit labels |
animation | string | 'fade' | Animation type (none, fade, slide, flip) |
onFinish | function | null | Callback when countdown ends |
Available Themes
Methods
// Start countdown
$('#myCountdown').ultraCountdown('start');
// Stop countdown
$('#myCountdown').ultraCountdown('stop');
// Reset countdown
$('#myCountdown').ultraCountdown('reset');
// Update option
$('#myCountdown').ultraCountdown('setOption', 'theme', 'night');
// Destroy instance
$('#myCountdown').ultraCountdown('destroy');