Так как же именно выглядит эта техника? Взгляните на гифку ниже

[suchona.kan.i.z]

Так родился параллакс.Перенесемся в 1980-е. Дико популярная и разрушающая дружбу игра Pong оставила ненасытный аппетит к большему количеству игр vidya. Индустрия осознала свой потенциал и начала изучать искусство игрового дизайна. И вы знаете, что это значит.

Все верно. Параллакс. Техника началась с небольшой игры под названием Moon Patrol, а затем быстро распространилась на такие классические игры, как Sonic The Hedgehog, Super Mario и многое другое.


Пример руководства по параллаксу
Видите, как передний план (кусты) движется быстрее среднего плана (холмов) и ослепительно быстрее заднего плана (неба)?

Это и есть параллакс. Он создает иллюзию глубины в двухмерном мире, заставляя наложенные друг на друга слои двигаться с разной скоростью.

Это то же самое, что мы видим в реальной жизни. Вы находитесь Список деловой рассылки Мальдив на пассажирском сиденье автомобиля, летящего по дороге на пять миль выше допустимой скорости. Вы смотрите в окно и видите, как магазины на обочине дороги пролетают мимо, а горы вдалеке едва шевелятся.

Это и есть параллакс.

И теперь параллакс приходит в веб-страницы. Все больше и больше сайтов переходят на параллакс, создавая приятные и мощные страницы для личного прочтения (аллитерация — это здорово).

Но как этот стиль переносится в веб-дизайн? Давайте остановимся на этой гифке и разберем ее по частям.

Sky-Параллакс
Фон: Это статичная часть веб-страницы. При прокрутке вниз (или даже поперек) фоновое изображение сайта будет выглядеть так, как будто оно вообще едва движется. Это то, что настраивает страницу на глубину.

Средний: На некоторых сайтах это есть, на других нет. Это классифицируется как любые изображения, которые находятся над фоновым изображением, но не являются частью контента. Эти изображения движутся немного быстрее, чем фон, что добавляет ощущение глубины по отношению к фону.