Созонов Алексей

Веб-разработчик

Скрипт обратного отсчета

09.08.2015

Недавно понадобился countdown script для сайта. Наткнулся на статью с большой и хорошей подборкой. Но, в частности, понравился этот из-за его простоты.

Пример использования

  $('#counter').countdown({
    stepTime: 60,
    format: 'hh:mm:ss',
    startTime: "12:32:55",
    digitImages: 6,
    digitWidth: 53,
    digitHeight: 77,
    timerEnd: function() { alert('end!!'); },
    image: "digits.png"
  });

Демо

Старт с определенной даты:

function GetStartTime() {
    var dateNow = new Date();
    var dateNowElapsedTime = dateNow.getTime() / 1000;

    var endDate = new Date(2012,2-1,3,10,30,0);//Date of 03 fev 2012 (notice the "minus one" for the month...)
    var endDateElapsedTime = endDate.getTime() / 1000;

    var timeStampInSec = endDateElapsedTime - dateNowElapsedTime;

    var minutesTmp = timeStampInSec / 60;
    var seconds = Math.floor(timeStampInSec % 60);
    var hoursTmp = minutesTmp / 60;
    var minutes = Math.floor(minutesTmp % 60);
    var days = Math.floor(hoursTmp / 24);
    var hours = Math.floor(hoursTmp % 24);

    return days + ":" + hours + ":" + minutes + ":" + seconds;
}

THen, when you call the CountDown, just replace the startTime value bye a call to the function GetStartTime() : 

$('#counter').countdown({
    stepTime: 60,
    format: 'hh:mm:ss',
    startTime: GetStartTime(),
    digitImages: 6,
    digitWidth: 53,
    digitHeight: 77,
    timerEnd: function() { },
    image: "digits.png"
  });

Правда код надо немного доработать (есть глюк, когда число меньше 10), поэтому прикрепил обсуждение этой проблемы:

Оригинал

#JQuery‏‎