Как отследить срабатывание position: sticky?

Question

[r_g_b_a]

Есть элемент с position: sticky. Нужно отследить, когда он прилипает к верхней части окна браузера. Нашел пример с использованием IntersectionObserver, но есть небольшая проблема, которую я не знаю как решить - коллбэк срабатывает при пересечении элементом в том числе и нижней части.
https://jsfiddle.net/52f79kgm/

Answer 1

[Евгений]

Получите позицию элемента с position: sticky относительно документа. Добавьте событие скрола. И когда скролл будет равен значению позиции элемента с position: sticky, то и пишите колбек
Пример

Comments

[r_g_b_a]

Вариант с событием скролла - не лучшее решение в плане производительности, так как вычисления срабатывают на каждом тике. IntersectionObserver в данной задаче идеальный выбор.
Спустя время, я нагуглил ответ к моему вопросу https://jsfiddle.net/mvxns7y1/
Достаточно проверять значение entries.boundingClientRect.top