Examples

• Default behavior

  // HTML
  <div class="timer-quick" data-seconds-left="5"></div>
  
  // JavaScript
  $(function(){
      $('.timer-quick').startTimer();
  })
  
  // CSS
  .jst-hours {
    float: left;
  }
  .jst-minutes {
    float: left;
  }
  .jst-seconds {
    float: left;
  }
  .jst-clearDiv {
    clear: both;
  }
  .jst-timeout {
    color: red;
  }
      

  (default behavior adds .timeout class when complete)

• console.log when complete

  //HTML
  <div class="timer" data-seconds-left="25"></div>
  
  // JavaScript
  $(function(){
      $('.timer').startTimer({
        onComplete: function(){
          console.log('Complete');
        }
      });
  })
      

• console.log when complete and allow pause on click

  // HTML
  <div class="timer-pause" data-minutes-left="1.5"></div>
  
  // JavaScript
      $(function(){
      $('.timer').startTimer({
        onComplete: function(){
          console.log('Complete');
        },
        allowPause: true
      });
  })
      

  (click on timer to pause/resume)

• timer structured elements span

  
  // HTML
  <span class="timer-span" data-minutes-left="5"></span>
  
  // JavaScript
  $('.timer-span').startTimer({
      elementContainer: "span"
  });