Как сделать чтобы при скроле страницы элементы разъезжались плавно друг от друга?

Question

[Corepro]

Как сделать чтобы при скроле страницы элементы разъезжались плавно друг от друга ?
пример изображения

Comments

[Corepro]

низкомолекулярный макрос, А если учесть что я не особо разбираюсь ))
Есть пример какой-то ?

[steklovatnik]

возможно, вам поможет intersectionobserver.
Он следит за тем, попал ли блок в область видимости (viewport), и насколько он виден от 0.1 до 1(но надо учесть, что при адаптиве на маленьком экране, а особенно - перевернутом, элемент может на 100 проц вообще не попасть на экран))).

либо можно отслеживать, насколько мы проскролили от верха сайта
window.addEventListener("scroll", ()=>{console.log(window.pageYOffset})
и подвязать эту величину к тому, насколько должны изменить свои координаты ваши обьекты.
Можно их изначально сдвинуть через css transform: translate(); и через js по мере приближения менять значение его.

[steklovatnik]

https://codepen.io/an6re9/pen/GRQyKOY набросал поверхностный пример

[Corepro]

steklovatnik, Спасибо, сделал )

[steklovatnik]

на здоровье)