Загрузка...

Сделал таймер оцените . vanilla js

Тема в разделе Frontend создана пользователем quarterback 20 апр 2024. 196 просмотров

  1. quarterback
    JS
        const timeDeadline = new Date("2024-05-20")

    const changeTime = (deadLine) => {
    const timeRigtNow = new Date ()
    const time = new Date(deadLine - timeRigtNow)
    let stop = null

    if(time.getSeconds() === 0){
    clearInterval(stop)
    }

    const days = document.querySelector("#days")
    const hours = document.querySelector("#hours")
    const minutes = document.querySelector("#minutes")
    const seconds = document.querySelector("#seconds")

    days.textContent = time.getDate()
    hours.textContent = time.getHours()
    minutes.textContent = time.getMinutes()
    seconds.textContent = time.getSeconds()
    setInterval(() => {
    stop = changeTime(timeDeadline)

    } , 1000)
    }


    changeTime(timeDeadline)
     
  2. шизоид
    шизоид 20 апр 2024 Loading... 5183 2 ноя 2020
    таймер на телефоне просто существует
     
  3. konchamp
    а смысл дней?
     
  4. azurescens
    azurescens 3 май 2024 5065 3 дек 2023
    У тебя интервалы настакиваются, там каждый раз в интервале создается новый интервал и просто перезаписывается id текущего таймера. В конечном итоге скрипт выкинет stack overflow exception, чтоб этого избежать нужно немного его переписать:

    JS
    const timeDeadline = new Date("2024-05-20");

    function updateTimer() {
    const timeCurrent = new Date();
    const difference = timeDeadline.getTime() - timeCurrent.getTime();

    if (difference < 0) {
    clearInterval(timer);
    document.getElementById('timer').innerHTML = formatTime(0);
    return;
    }

    document.getElementById('timer').innerHTML = formatTime(difference);
    }

    const timer = setInterval(updateTimer, 1000);

    function formatTime(milliseconds) {
    const date = new Date(milliseconds);
    const days = date.getDate() - 1;
    const hours = date.getUTCHours();
    const minutes = date.getUTCMinutes();
    const seconds = date.getUTCSeconds();

    return `
    <div>${days} Days</div>
    <div>${hours} Hours</div>
    <div>${minutes} Minutes</div>
    <div>${seconds} Seconds</div>
    `;
    }
     
    3 май 2024 Изменено
  5. Уебатьский
    Уебатьский 10 май 2024 Заблокирован(а) 0 10 май 2024
    все гуд, теперь знай что это все параша
     
Загрузка...
Top