Countdown-timer is a free, modern website plugin, written in JavaScript. The main advantage is performance and simplicity. The timer currently has two modes of operation:
- Type "number" - takes the number of hours (from 0 to 99)
- Type "date" - takes date as "Month Day, Year, hh:mm:ss".
- type: "number"
- time: 1
- changeTitle: false - insert current time in page title
- autoDestroy: false - if time runs out, the timer will be destroyed (deleted from the DOM)
- autoGenerate: true - automatic generation of timer structure
<div class="timer"></div>For css:
<link href="countdown-timer/styles/css/style.css" rel="stylesheet">For scss:
@import "countdown-timer/styles/scss/style.scss";import { CountdownTimer } from 'countdown-timer';const timer = new CountdownTimer('timer-className', {
type: 'number',
time: 1,
changeTitle: false,
autoDestroy: false,
autoGenerate: true,
});
timer.init();Initialization timer:
timer.init()Destroy timer:
timer.destroy()Get the formatted time as object:
timer.time
result = {
hours: hh,
minutes: mm,
seconds: ss,
}If you have set autoGenerate: false, you need to put this code:
<div class="timer">
<div class="timer-item timer-hours">
<span class="timer-digit"></span>
<span class="timer-digit"></span>
</div>
<div class="timer-item timer-minutes">
<span class="timer-digit"></span>
<span class="timer-digit"></span>
</div>
<div class="timer-item timer-seconds">
<span class="timer-digit"></span>
<span class="timer-digit"></span>
</div>
</div>;