Создание красивого сайта с Parallax эффектом при скролле | HTML CSS JavaScript

Создание сайта от А до Я (комплексный курс): https://goo.gl/ankxq9
Создание интернет-магазина от А до Я: https://goo.gl/7mDqYD
Создание крутого слайдера (+посадка на CMS): https://bit.ly/jVLyQ8

Все курсы в одном комплекте: https://wd-m.ru/bundle

В этом уроке мы рассмотрим создание красивого сайта с Parallax эффектом при скролле. Сегодня я покажу, как происходит разработка таких крутых сайтов и подробно объясню каждый шаг. Ключевой особенностью данного примера является, конечно-же, реализация эффекта Parallax на сайте - вы удивитесь, насколько просто и быстро можно делать подобные вещи, используя современный CSS.

Страница урока: https://webdesign-master.ru/blog/html-css/parallax-scrolling-website.html

Таймкоды:
00:00 Начало урока
01:57 Обзор материалов урока
02:49 Подготовка изображений для Parallax эффекта в CSS
11:28 Приступаем к HTML верстке сайта
13:49 Подключаем файлы CSS и JavaScript
14:55 HTML верстка сайта (вся разметка)
19:54 Приступаем к CSS стилизации
21:02 Подключение шрифтов CSS
22:50 Стилизация тега body
23:58 Верстка шапки сайта - стили parallax слоев
26:21 Параллакс-эффект с помощью JavaScript
31:11 Логика движения слоев Parallax в CSS
36:39 Верстка заголовков сайта и эффект «свечения»
45:32 Полоса между блоками - решение
50:04 CSS стилизация первой секции сайта
56:32 Создание параллакс эффекта у контента
59:09 Плавная прокрутка страницы JS
1:04:41 Анимация Cubic Bezier для Parallax эффекта в CSS
1:11:00 Что ещё изучить?

ВКонтакте: https://vk.com/jediweb
Телеграм: https://t.me/jediweb
Дзен: https://wd-m.ru/zen