Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 14.01.2021, 01:22
Аспирант
Отправить личное сообщение для Hovik Посмотреть профиль Найти все сообщения от Hovik
 
Регистрация: 15.10.2018
Сообщений: 99

Создание счетчика обратного отчета
Привет всем хочу реализовать в сайте счетчика обратного отчета с двумя фиксирование датами но не получается прошу помаши, вот код
<ul class="timer" id="timer"></ul>

jQuery(document).ready(function($) {
    
    let timer_start,timer_end, distance, hour,minut, second;

        timer_start = new Date("2021-01-13 12:32:46").getTime();
        timer_end   = new Date("2021-01-14 12:32:46").getTime();
        distance =  ((timer_end - timer_start) / 1000);

let x = setInterval(()=> {

    distance --
    hour = Math.floor((distance / ( 3600 ) %24) );
    minut = Math.floor((distance / 24 / 60 ) % 60) 
    second = Math.floor(distance % 60)
    $('.timer').html('<li>'+hour+':</li><li>'+minut+':</li><li>'+second +'<li>')
}, 1000);

   if (distance < 0) clearInterval(x);
    
    
});
Ответить с цитированием
  #2 (permalink)  
Старый 14.01.2021, 07:43
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,549

Hovik,
проблема то в чём?
Ответить с цитированием
  #3 (permalink)  
Старый 15.01.2021, 00:45
Аспирант
Отправить личное сообщение для Hovik Посмотреть профиль Найти все сообщения от Hovik
 
Регистрация: 15.10.2018
Сообщений: 99

рони,
Счетчик не работает результат должен быт таким
<ul class="timer" id="timer">
<li>23:</li>
<li>59:</li>
<li>59</li>
</ul>

и дальше продолжатся в каждую секунду уменьшатся
<ul class="timer" id="timer">
<li>23:</li>
<li>59:</li>
<li>58</li>
</ul>
Ответить с цитированием
  #4 (permalink)  
Старый 15.01.2021, 01:30
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,549

таймер между датами
Hovik,
<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">

    <style type="text/css">
        @import url('https://fonts.googleapis.com/css?family=Old%20Standard%20TT&display=swap');
        ul.timer {
            list-style: none;
            display: flex;
            font-size: 3em;
            margin: 20px;
            padding: 0;
            justify-content: center;
            font: 400 2.4em / 23px "Old Standard TT", sans-serif;
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        jQuery(document).ready(function($) {
            let timer_start, timer_end, distance, hour, minut, second, now;
            now = Date.now();
            timer_start = new Date("2021-01-13 12:32:46").getTime();
            timer_end = new Date("2021-01-15 12:32:46").getTime();
            distance = (timer_end - now) / 1000 ;
            if (now < timer_start || now > timer_end) return;
            let x = setInterval(() => {
                distance--
                hour = Math.floor(distance / (60 * 60));
                minut = Math.floor(distance / 60 % 60);
                second = Math.floor(distance % 60)
                $('.timer').html('<li>' + hour + ':</li><li>' + minut.toString().padStart(2, "0") + ':</li><li>' + second.toString().padStart(2, "0") + '</li>')
            }, 1000);
            if (distance < 0) clearInterval(x);
        });
    </script>
</head>
<body>
    <ul class="timer" id="timer"></ul>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 15.01.2021, 01:45
Аспирант
Отправить личное сообщение для Hovik Посмотреть профиль Найти все сообщения от Hovik
 
Регистрация: 15.10.2018
Сообщений: 99

рони
разница между датами "2021-01-13 12:32:46" и "2021-01-15 12:32:46" 48 часов а выводится 9 часов 44 минут и 33 сек
Ответить с цитированием
  #6 (permalink)  
Старый 15.01.2021, 01:58
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,549

Hovik,
мне сложно понять вашу логику.
Ответить с цитированием
  #7 (permalink)  
Старый 15.01.2021, 02:01
Аспирант
Отправить личное сообщение для Hovik Посмотреть профиль Найти все сообщения от Hovik
 
Регистрация: 15.10.2018
Сообщений: 99

рони,
извините вы все сделали как всегда правильно, это я запутался все супер спасибо вам огромная
Ответить с цитированием
  #8 (permalink)  
Старый 15.01.2021, 02:03
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 29,549

Hovik,
ок!
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Таймер обратного отчета по клику. dmtrave Общие вопросы Javascript 1 19.10.2016 23:44
Помогите с счетчиком обратного отчета yahoo Общие вопросы Javascript 6 29.01.2016 12:24
Счётчик обратного отчёта chir.pro.tt jQuery 0 01.02.2014 18:47
Таймер обратного отчёта с выполнение по времени xakerd Элементы интерфейса 1 19.03.2013 23:10
Создание счетчика The special one Общие вопросы Javascript 2 28.05.2012 12:11