Как правильно реализовать интерфейс с блокированием скролла?

Question

[nazar-lynovetsky]

Ссылка на пример реализации.

На странице по ссылке (в середине страницы) есть секция с названием "What we do". Посмотрите на работу этого интерфейса. Он работает так:

- Мы скроллим body до секции What we do.
- На секции What we do блокируется скролл на body.
- Внутри секции мы можем скроллить внутренний контейнер при заблокированом скролле на body.
- После того как мы проскроллили весь внутренний контейнер секции What we do - разблокируется скролл body и мы можем скроллить всю страницу целиком дальше.

Как это сделать? Возможно уже есть готовые решения?

Answer 1

[nazar-lynovetsky]

Для реализации подобного поведения используется библиотека Scrollama.
Ссылка на сорс: https://github.com/russellgoldenberg/scrollama