Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.02.2012, 09:33
Интересующийся
Отправить личное сообщение для progns Посмотреть профиль Найти все сообщения от progns
 
Регистрация: 23.05.2011
Сообщений: 16

обратный счетчик на сайте
Здравствуйте, уважаемые js программисты!

Подскажите, пожалуйста, как организовать на сайте обратный подсчет времени. Нужно выводить на сайте сколько дней осталось до события, а по окончанию времени вывести сообщение о том, что событие прошло.

Может есть готовый скрипт у кого-нибудь?

Заранее благодарю.
Ответить с цитированием
  #2 (permalink)  
Старый 08.02.2012, 10:16
Профессор
Отправить личное сообщение для Seva1986 Посмотреть профиль Найти все сообщения от Seva1986
 
Регистрация: 01.10.2011
Сообщений: 422

progns,

такой пойдёт?

function getDaysLeft() {
    var daysLeft = (new Date(2012, 01, 09) - new Date())/1000/60/60/24;
    daysLeft = daysLeft>0 && daysLeft<1 ? 1 : daysLeft;
    if (daysLeft < 0) {
        clearInterval(timer);
        alert('Time is up!');
        return;
    }
    alert(daysLeft);
}

var timer = setInterval(getDaysLeft, 1000*60);
getDaysLeft();

Последний раз редактировалось Seva1986, 08.02.2012 в 10:27.
Ответить с цитированием
  #3 (permalink)  
Старый 08.02.2012, 11:33
Интересующийся
Отправить личное сообщение для progns Посмотреть профиль Найти все сообщения от progns
 
Регистрация: 23.05.2011
Сообщений: 16

Спасибо, но не совсем понимаю как им пользоваться.
выводит "1" Ваш код и все
Ответить с цитированием
  #4 (permalink)  
Старый 08.02.2012, 12:04
Профессор
Отправить личное сообщение для Seva1986 Посмотреть профиль Найти все сообщения от Seva1986
 
Регистрация: 01.10.2011
Сообщений: 422

Сообщение от progns
"1" Ваш код и все
ну потому что конечная дата стоит завтра а до завтра один день. Если поменять будет другое.
Я так понял вы скрипт совсем не знаете. напишите детальнее куда вам выводить эти данные например id элемента куда вывести число дней, и куда вывести сообщение об окончании времени
Ответить с цитированием
  #5 (permalink)  
Старый 08.02.2012, 12:57
Интересующийся
Отправить личное сообщение для progns Посмотреть профиль Найти все сообщения от progns
 
Регистрация: 23.05.2011
Сообщений: 16

допустим, есть <div id="test"></div>. Здесь нужно выводить "до события осталось столько-то дней" , естественно с каждым днем уменьшается число (кстати надо выводить 3 дня, 5 дней, 1 день с правильными окончаниями) , а как доходим до заданной даты выводит сообщение о том что "событие прошло". Да, Js я не знаю, можно сказать.
Ответить с цитированием
  #6 (permalink)  
Старый 08.02.2012, 13:23
Профессор
Отправить личное сообщение для Seva1986 Посмотреть профиль Найти все сообщения от Seva1986
 
Регистрация: 01.10.2011
Сообщений: 422

progns,

Ок! вечером замучу...
Ответить с цитированием
  #7 (permalink)  
Старый 08.02.2012, 13:28
Интересующийся
Отправить личное сообщение для progns Посмотреть профиль Найти все сообщения от progns
 
Регистрация: 23.05.2011
Сообщений: 16

допустим, есть <div id="test"></div>. Здесь нужно выводить "до события осталось столько-то дней" , естественно с каждым днем уменьшается число (кстати надо выводить 3 дня, 5 дней, 1 день с правильными окончаниями) , а как доходим до заданной даты выводит сообщение о том что "событие прошло". Да, Js я не знаю, можно сказать.
Ответить с цитированием
  #8 (permalink)  
Старый 08.02.2012, 13:29
Интересующийся
Отправить личное сообщение для progns Посмотреть профиль Найти все сообщения от progns
 
Регистрация: 23.05.2011
Сообщений: 16

спасибо большое.
Ответить с цитированием
  #9 (permalink)  
Старый 08.02.2012, 19:17
Профессор
Отправить личное сообщение для Seva1986 Посмотреть профиль Найти все сообщения от Seva1986
 
Регистрация: 01.10.2011
Сообщений: 422

Вот вроде работает.

<!DOCTYPE HTML>
<html lang="ru">
<head>
    <meta charset="UTF-8"/>
    <title>Таймер</title>
    <style>
        #test {
            color: red;
            font-size: 30px;
        }
    </style>
</head>
<body>
<div id="test"></div>

<script>

    function SetDaysTimer(dd, mm, yy, timerElement, message, timerUpdateTime) {
        function getDaysLeft() {
            var daysLeft = (new Date(yy, mm - 1, dd) - new Date()) / 86400000;
            if (daysLeft > parseInt(daysLeft)) daysLeft = parseInt(daysLeft) + 1;
            return daysLeft;
        }

        function formatDays(daysLeft) {
            var doubleEnding = ('0' + daysLeft).slice(-2);
            var singleEnding = ('0' + daysLeft).slice(-1);

            if ((doubleEnding > 10 && doubleEnding < 20) || singleEnding > 4 || singleEnding == 0) {
                return 'дней';
            } else if (singleEnding == 1) return 'день';
            return 'дня';
        }

        function showMessage(daysLeft) {
            if (daysLeft < 0) {
                timerElement.innerHTML = message;
                clearInterval(timer);
                return;
            }
            timerElement.innerHTML = daysLeft + ' ' + formatDays(daysLeft);
        }

        var timer = setInterval(function () {
            showMessage(getDaysLeft())
        }, (timerUpdateTime || 1) * 60000);
        showMessage(getDaysLeft());
    }

    /* Использование
     new SetDaysTimer(
     dd,  - число события
     mm,  - месяц события
     yy,  - год события
     timerElement, - элемент куда выводить сообщение
     message, - текст сообщения
     timerUpdateTime - время обновления сообщения в минутах, по умолчанию 1 минута
     );

     Пример
     */

    new SetDaysTimer(
            21,
            12,
            2012,
            document.getElementById('test'),
            'Конец света наступил',
            5
    );


</script>

</body>
</html>
Ответить с цитированием
  #10 (permalink)  
Старый 08.02.2012, 19:31
Интересующийся
Отправить личное сообщение для progns Посмотреть профиль Найти все сообщения от progns
 
Регистрация: 23.05.2011
Сообщений: 16

Спасибо огромное. То что нужно.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
добавить счетчик в счетчик dimon76 Events/DOM/Window 1 28.06.2011 22:06
Сервисы для реализации оплаты кредитками на сайте. nyols Серверные языки и технологии 1 29.05.2011 12:44
Помогите усовершенствовать счетчик fredrsf Элементы интерфейса 1 30.06.2010 14:38
отключение кнопочки обновления на сайте azetoon Общие вопросы Javascript 3 29.06.2008 10:14
Отображение локальных картинок на удаленном сайте Esciloner (X)HTML/CSS 3 17.12.2007 00:48