Biblioteca de JavaScript de cuenta regresiva minimalista-timeCounter. js
| Autor: | forhadulislam |
|---|---|
| Views Total: | 3,073 |
| Sitio oficial: | Ir a la web |
| Actualizado: | December 29, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
timeCounter. js es una biblioteca de JavaScript extremadamente ligera que se utiliza para crear un temporizador de cuenta regresiva en años, meses, días, horas y segundos.
Funcionamiento
Agregue la biblioteca de JavaScript timeCounter. js a la Página Web.
<script src="timeCounter.js"></script>
Cree un elemento HTML para el temporizador de cuenta regresiva.
<div class="jcountTimer"></div>
Especifique la fecha y hora desde la que desea realizar la cuenta regresiva.
var Time = "7/11/2016 18:25:00";
setInterval(function() { countDown(".jcountTimer", Time) }, 1000); Estilo del temporizador de cuenta regresiva utilizando sus propios estilos CSS.
.jcountTimer {
font-weight: 100;
font-size: 2em;
}
.jcountTimer span {
display: block;
min-width: 80px;
float: left;
margin-right: 10px;
background: #ddd;
padding: 5px;
text-align: center;
border-radius: 3px;
}
.jcountTimer small {
display: block;
font-size: .5em;
}
.jcountTimer .days { color: #65ada2; }
.jcountTimer .hours { color: #da6665; }
.jcountTimer .minutes { color: #adb87a; }
.jcountTimer .seconds {
color: #916c80;
animation: removeText 1s forwards;
}
@keyframes
removeText {
0% {
margin-top: 0;
}
80% {
margin-top: 0;
}
100% {
margin-top: -10px;
}
}
