Minimalist Countdown JavaScript Library – timeCounter.js

Preview:

Description:

timeCounter.js is an extremely lightweight JavaScript library used for creating a countdown timer in years, months, days, hours and seconds.

How to use it:

Add the timeCounter.js JavaScript library to the web page.

<script src="timeCounter.js"></script>

Create an html element for the countdown timer.

<div class="jcountTimer"></div>

Specify the datetime you want to countdown from.

var Time = "7/11/2016 18:25:00";
setInterval(function() { countDown(".jcountTimer", Time) }, 1000);

Style the countdown timer using your own CSS styles.

.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;
}
}