Как реализовать такой скролл в верстке?

Привет. Столкнулся с такими хотелками, и не совсем понимаю реально ли реализовать такое.
Суть - сперва идет блок первого экрана. За ним идет блок который должен скроллиться по горизонтали и иметь параллакс фон (фон едет медленнее контента) далее при прокрутке этого блока страница скролиться дальше вниз и имеет так же параллакс фон.
61b1ff085d06d563803984.png

Попробовал уже Rellax JS и Locomotive Scroll - обе библиотеки поддерживают горизонтальный скролл сам по себе, но совместить на одной странице вертикальный и горизонтальный не дают. Это вообще возможно?
  • Вопрос задан
  • 421 просмотр
Пригласить эксперта
Ответы на вопрос 3
Fragster
@Fragster
помогло? отметь решением!
profesor08
@profesor08 Куратор тега CSS
https://scrollmagic.io/
https://scrollmagic.io/examples/advanced/section_w...

По сути горизонтальной прокрутки нет, и не должно быть, она не удобная. Но есть эффект перемещения блоков по горизонтали.
Ответ написан
Комментировать
@Shatge
Веб-разработчик
Привет. Такой скролл легко сделать с помощью overflow-x: scroll и overflow-y: scroll
https://developer.mozilla.org/en-US/docs/Web/CSS/o...
https://developer.mozilla.org/en-US/docs/Web/CSS/o...

Для мобилок идеально подходит - пример Википедия таблицы так делает.
Но если разбирать десктопную версию, то в разных браузерах будет по разному смотреться. И тогда лучше использовать библиотеку. Тут уже на выбор то что вам нравится.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы