jquery to achieve the countdown effect _jquery

Design a quiz game, each problem can have 20 seconds to answer, more than time to give a corresponding reminder, due to 20 seconds too long, not suitable for GIF dynamic map, the following look at the 5 seconds I write the test program results:

First, the main procedure

<! DOCTYPE html>
 
 

Second, CSS style

*{
  margin:0;
  padding:0;
}
html{
  font-size:12px
}
. countdown{
  Width:3.8rem;
  Text-align:center;
  Margin:2rem Auto 0 auto;
Countdown #countDownTime {
  font-size:2rem;
}

Three, jquery program

First, the principle of the countdown:

1. Convert time to 0:0 format

2, need to open a timer, every 1000ms let time automatically minus 1

3, to determine whether the time is 0, if 0 is to represent the end of the timer, at this time need to give hints or do other things

The following is a detailed implementation of the countdown program:

$ (function () {
  var countdowntime=parseint (5);    Here you set the answer for each question long
  function countdown (countdowntime) {
    var timer=setinterval (function () {
      if ( countdowntime>=0) {
        showTime (countdowntime);
        countdowntime--;
      } else{
        clearinterval (timer);
        Alert ("Timed over, give a hint");
      }
    },1000;
  }
  Countdown (countdowntime);
  function ShowTime (countdowntime) {      //This segment is the specific number of calculated minutes and seconds
    var minute=math.floor (COUNTDOWNTIME/60);
    var second=countdowntime-minute*60;
    $ ("#countDownTime"). Text (minute+ ": +second);
  }
}"

With the principle of my writing to see this JS program is easier to estimate, I hope to help small partners.