1

Есть куча вопросов с таким названием, но они немного мне не подходят. У меня есть скрипт, который проверяет есть ли блок в поле видимости окна браузера. И есть число, которое я хочу анимировать, рост температуры от 0 до 60. я написал вот такой скрипт для этого

function checkTempWidth() {
    if (!animTemp) {

    } else {
        let startTemp = 0;
        let endTemp = 60;
        let el = animTemp;
        function interval() {
            if (startTemp !== endTemp) {
                startTemp++;
                animTemp.innerHTML = `${startTemp}`;
            } else {
                startTemp = endTemp;
            }
            return startTemp
        }
        let spaceBellow = window.innerHeight - el.getBoundingClientRect().bottom + el.offsetHeight;
        let topDistance = el.getBoundingClientRect().top + el.offsetHeight;
        // console.log(topDistance + 'topDistacne');
        if (60 < spaceBellow && topDistance > 0) {

                setInterval(interval, 100);

        } else {

        }

    }
}
И если при перезагрузке все хорошо и он срабатывает один раз, то если скролить страницу, когда блок в зоне видимости, он запускает кучу этих интервалов Как бы это исправить? Я хочу что бы когда блок появился в окне браузера, запустился этот скрипт и все, больше не нужно. Спасибо. Если знаете как это сделать на jQ, то ок, только расшифруйте что и как там

1

1 ответ 1

1
let timer;
function checkTempWidth() {

  function interval() {
    if (startTemp !== endTemp) {
      startTemp++;
      animTemp.innerHTML = `${startTemp}`;
    } else {
      timer = clearInterval(timer);
    }
  }
  ...

    if (!timer)
      timer = setInterval(interval, 100);
3
  • с setTimeout число увеличивается только один раз, если вывести переменную startTemp вне функции, то просто будет +1 при каждом ивенте скролла
    – Juka Chu
    24 дек 2020 в 15:48
  • Спасибо огромное, это работает)
    – Juka Chu
    24 дек 2020 в 15:57
  • 2
    @JukaChu Пожалуйста. Успехов. Знак "галочка" - слева от ответа.
    – user176262
    24 дек 2020 в 15:59

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.