JavaScript / JQuery Обратный отсчет

Question

То, что я хотел бы сделать, это обратный отсчет, который обновляет в прямом эфире ... как это:

6 дней (только дни)

12 часов (всего несколько часов в течение 1 дня)

59 минут (всего несколько минут в течение 1 часа)

59 секунд (всего несколько секунд в течение 1 минуты)

Лучший способ сделать это?

Answer 1

Рабочий пример можно найти по адресу http://jsfiddle.net/gaby/QH6X8/79/

var end = new Date('15 Dec 2010');

var _second = 1000;
var _minute = _second * 60;
var _hour = _minute * 60;
var _day = _hour *24

var timer;

function showRemaining()
{
    var now = new Date();
    var distance = end - now;
    if (distance < 0 ) {
       // handle expiry here..
       clearInterval( timer ); // stop the timer from continuing ..
       alert('Expired'); // alert a message that the timer has expired..
    }
    var days = Math.floor(distance / _day);
    var hours = Math.floor( (distance % _day ) / _hour );
    var minutes = Math.floor( (distance % _hour) / _minute );
    var seconds = Math.floor( (distance % _minute) / _second );

    var countdownElement = document.getElementById('countdown');
    countdownElement.innerHTML = 'Days: ' + days + '<br />';
    countdownElement.innerHTML += 'Hours: ' + hours+ '<br />';
    countdownElement.innerHTML += 'Minutes: ' + minutes+ '<br />';
    countdownElement.innerHTML += 'Seconds: ' + seconds+ '<br />';
}

timer = setInterval(showRemaining, 1000);

Answer 2

Плагин обратного отсчета jQuery

Answer 3

jCounter предлагает контроль над тем, в каком формате вы хотите, чтобы ваш отсчет отображался среди других настроек и методов управления.

Answer 4

Проблема с принятым выше подходом состоит в том, что здесь будут проблемы, связанные с различиями часовых поясов и переходом на летнее время. См. Этот вопрос, заданный мной Проблемы с обратным отсчетом JavaScript и часовым поясом и переходом на летнее время

Answer 5

Заметное упоминание: http://www.littlewebthings.com/projects/countdown/ (возможно, не имеет значения, поскольку вы упомянули, что не хотите использовать плагин)

Answer 6

здесь вы можете сгенерировать таймер обратного отсчета, если хотите - просто нажмите «Генерировать» и скопируйте и вставьте результаты в файл .html

http://www.ricocheting.com/code/javascript/html-generator/countdown-timer