так я же намекнул что он не для продвинутых задач

Но, с другой стороны, да, если что-то очень простое, то codepen хороший

Всем привет
Подскажите, пожалуйста, как заставить работать анимацию, когда пользователь до неё доскролил
Пробую так
вешаю листенер на скролл
и смотрю на изменение высоты страницы к необходимому блоку через свойство getBoundingClientRect.top
И всё бы было хорошо, но это свойство не всегда находит необходимую мне высоту ( допустим, мне нужно 50px, при скролле иногда значение перепрыгывает 50 и может быть 49 и тд)
Если я ставлю промежуток высоты, к примеру с 50 до 20, то анимация начинает вызываеться много раз (в данном случае около 30 раз)
Как мне найти эту необходимую точку и один раз вызвать анимацию?

Я бы при возможности Intersection Observer API использовал

у тебя какая-то незаурядная анимация? библиотеку не хочешь подключить? (это я так... для ленвых) ))

я и подключаю lottie
анимация состоит с картинок и джейсона
мне нужно получить высоту к элементу и один раз вызвать анимацию
когда пользователь дальше скроллит - я её удаляю и так по кругу

Привет всем! Подскажите пожалуйста как правильно называть переменные.

список контактов

contactsLIst or contactList

Один контакт

contactItem or contactsItem

спасибо, попробую
хотелось бы без линших библиотек
знаю, что это можно на js сделать
но пока не смог

это не библиотека

ну пакет)
это лендос и размер бандла играет роль
хоть и она весит мало

это нативное апи браузера

это браузер АПИ

вижу)
первая ссылка была на пакет реакта)
не дочитал
прошу прощения

я уже использовал свойство этого АПИ (выше писал)
getBoundingClientRect().top;
его проблема вот в этом
что при скролле он пропускает некоторые значения высоты
и я не могу найти нужное мне

уже пробовал )
он не решает нужную мне проблему
при скролле вниз он просто показывает блок
а мне нужно запустить анимацию элемента, а не просто его показать
разве что к классу элемента привязываться, когда элемент начинает анимироваться
но это как костыль
но спасибо за попытку)

сделайте песочницу)))

Чем тогда не устраивает IntersectionObserver, который выше советовали?

написал же
его свойство getBoundingClientRect().top показывает изменение высоты к блоку
но пропускает необходимую мне высоту
видите, значения через 5 -1- пикселей

getBoundingClientRect там не нужен, когда элемент isIntersecting делай что нужно