Как реализуются подобные лендинги?

Добрый день!
Есть пример лендинга шаблон

Интересует вопрос реализации таких лендингов, а именно:
1. При скролле есть неподвижные блоки с background-image, а сверху них блоки/секции, которые "реагируют на скролл". Видно, что таких неподвижных background-image в шаблоне есть как минимум три. Как их располагать? Какие свойства им задавать?
Отладчик f12 мне не помог разобраться..((
2. Как называется такой подход в верстке( если вообще есть у него название)?

Буду благодарен за ответ.
  • Вопрос задан
  • 1310 просмотров
Решения вопроса 2
T_y_l_e_r
@T_y_l_e_r
Вроде там просто div друг за другом и укаждого дива свой бэкграунд с фиксом, а так же контент который идет поверх и устанавливает высоту.

ВОТ
codepen.io/anon/pen/rjoyxv
Ответ написан
DarrellStanding
@DarrellStanding
Учусь Front-end разработке
Если я правильно понял вопрос, то у тех секций с заданным фоном - картинкой просто стоит свойство background-attachment: fixed; и при скролле создается такой визуальны эффект.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 3
alina_ivanovna
@alina_ivanovna
я думаю это подойдет, если значения покрутить Simple Parallax Scrolling
Ответ написан
@Allan11
Фронтенд
Ответ написан
Комментировать
@feuer81
webdesignmaster у себя на канале размещал подробное видео верстки в том числе с применением подобного эффекта
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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