Анимация чисел с увеличением/уменьшением

Добавляет эффект увеличения/уменьшения чисел в Zero-блоках

Инструкция по установке

  • Cкопируйте код ниже и вставьте его внутрь <head> в настройках сайта
    Этот скрипт устанавливается только один раз и помогает модификациям работать. Если он уже стоит у вас на сайте, добавлять его снова не нужно, просто пропустите этот шаг.
<script src="https://cdn.postnikovmd.com/tilda@1.4/mods.min.js"></script>
Скопировать код
Код скопирован!
Синхронизация обновлений включена. Новые версии и исправления будут устанавливаться автоматически.
Синхронизация обновлений отключена. Текущая версия останется неизменной, независимо от обновлений.
  • Задайте тексту, для которого хотите применить эффект, класс .uc-numbers
    Если вы планируете использовать несколько элементов с таким эффектом, задайте им разные классы, например, .uc-numbers1 и .uc-numbers2
  • Задайте в настройках модификации параметры анимации чисел
  • Скопируйте код и вставьте его в блок T123 в конец страницы
Как это сделано?
<script>numbers.init(".uc-numbers", { transition: 1000, start: 1 })</script>
Настройки модификации

Настройки модификации

Класс текстового блока:
Скорость анимации:
Конечное значение:
Оставьте пустым, если хотите, чтобы конечным значением осталось текущее число в блоке
Начальное значение:
По начальному значению определяется, в какую сторону будет работать анимация (увеличение/уменьшение).

Если начальное значение меньше конечного, то анимация будет увеличивать число, если больше, то наоборот.
<!--numbers.js Анимация чисел с увеличением/уменьшением. https://postnikovmd.com/mods/numbers-->
<script>numbers.init(".uc-numbers")</script>
Скопировать код
Скопировать код
Код скопирован!

Особенности

  • Работает с целыми числами
    Модификация поддерживает только целые числа. Например, 100 или 1 000
  • Поддерживает префиксы
    Любые символы до и после числа. Например, «<» или «руб.»
  • Запускается по триггеру
    Если элемент с контейнером находится в видимой зоне экрана

Документация

Параметры

Если при установке что-то пошло не так

Добавьте параметр ?showerrors в конец ссылки, чтобы увидеть ошибки и рекомендации по их исправлению
Понравились модификации?
Можете отправить любую сумму, чтобы поблагодарить автора за работу. Вам плюсик в карму, а мне приятно!
 
Поделитесь впечатлениями
Нравятся модификации?
Расскажите про опыт ваш работы с модификациями — обратная связь поможет сделать их лучше
Расскажите про ваш опыт работы с ними — обратная связь поможет сделать их лучше
Сообщение отправлено
Спасибо, что делитесь с нами! Это помогает нам развиваться и улучшать сервис