Javascript.RU

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

Анимация цифр на сайте
Здравствуйте! Подскажите, пожалуйста. Делаю анимацию цифр (отсчет от нуля до определенного значение) при показе определенного блока на сайте.
Но проблема в том, что когда цифры доходят до конца, то начинается обратный отсчет. Как сделать чтобы не было обратного отсчета?
И вторая проблема в том, что отчет останавливается, если начать переключать вкладки браузера во время анимации цифр.

<div id="start_counter">
<h1 class="anim">100</h1>
</div>


var start_counter = document.getElementById("start_counter");
 
document.onscroll = function() {
var top = start_counter.getBoundingClientRect().top;
var heightScreen = document.documentElement.clientHeight;
var body = document.querySelector("body");
var g = top - heightScreen;
if (g <=0){
$(document).ready(function() {
  $('.anim').each(function() {
    $(this).prop('CounterUp', 0).animate({
    CounterUp: $(this).text()
    }, {
    duration: 5000,
    easing: 'swing',
    step: function(number) {
    $(this).text(Math.ceil(number));
      }
    });
  });
});
}
}
Ответить с цитированием
  #2 (permalink)  
Старый 30.06.2023, 10:37
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,103

max74max74,
https://javascript.ru/forum/misc/603...tml#post439702
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
spincrement - анимация не только цифр tp-20 jQuery 2 19.04.2021 23:56
Как сделать, чтобы анимация числа работала не только при активном окне? Lefseq Общие вопросы Javascript 4 07.03.2020 09:53
Проблема с кнопкой на сайте musaisaev271020 Элементы интерфейса 2 03.07.2019 08:32
Как реализована анимация на сайте популярной игры? whoIam Общие вопросы Javascript 6 19.09.2016 09:45
Управление скроллом "а-ля тач" HonesT Элементы интерфейса 2 27.08.2013 14:25