Temporizador de cuenta regresiva de JavaScript más simple-pureJSTimer

Vista prévia

Descripción

Una librería JavaScript simple y discreta para crear un temporizador de cuenta regresiva que te permite contar (arriba) desde (hasta) una hora específica.

Funcionamiento

Incluya el Pure-JS-Timer. js en la página HTML.

<script src="js/pure-js-timer.js"></script>

Cree un contenedor vacío para el temporizador de cuenta regresiva.

<div id="timer">

...
</div>

Cree un nuevo temporizador de cuenta regresiva.

pureJSTimer({

container
: '#timer',

endDate

: '2015 october 3',

afterUpdate: function(startDate, endDate, currentDate) {


//

},

onFinish
 : function(startDate, endDate) {


//

}
});

Cree un nuevo temporizador de recuento.

pureJSTimer({

container
: '#timer',

addYears
 : 1,

addMonths
: 2,

addDays

: 45,

addHours
 : 5,

addMinutes : 30,

addSeconds : 47,

countUp

: true,

afterUpdate: function(startDate, endDate, currentDate) {


//

},

onFinish
 : function(startDate, endDate) {


//

}
});

Añade tus propios estilos al temporizador de cuenta regresiva.

.pure-js-timer-days:after { content: "days"; }

.pure-js-timer-hours:after { content: "hours"; }

.pure-js-timer-minutes:after { content: "minutes"; }

.pure-js-timer-seconds:after { content: "seconds"; }

.pure-js-timer-container {

margin-bottom: 30px;

padding-bottom: 16px;

text-align: center;
}

.pure-js-timer-unit {

display: inline-block;

font-size: 24px;

font-weight: 700;

position: relative;

width: 150px;
}

.pure-js-timer-unit:after {

bottom: -16px;

font-size: 16px;

left: 0;

position: absolute;

text-align: center;

width: 100%;
}