Как сделать такую прокрутку по странице?
Как можно было бы сделать такую прокрутку по странице? В плане страница стоит на месте, а при прокрутке элементы как-то меняют свои значения.
Источник: Stack Overflow на русском
Ответы
Для начала, страница все-таки не стоит на месте, прокрутка все равно идет. Такие анимации совершаются с помощью события scroll, получения значений из scrollingElement и работой с requestAnimationFrame. По этим данным на JS уже можно рисовать анимации. Выходит что-то такое:
window.addEventListener('scroll', () => {
// По этим данным уже можно что-то отрисовать
const scrollingElem = document.scrollingElement;
const scrollTop = scrollingElem.scrollTop;
const maxScrollTop = scrollingElem.scrollHeight - window.innerHeight;
const scrollFraction = scrollTop / maxScrollTop;
// ...
});
Универсальных способов тут нет, все индивидуально. Самой лучшей идеей будет посмотреть примеры реализаций подобных сайтов. Вот неплохой пример