Создание сайта от А до Я (комплексный курс): https://goo.gl/ankxq9
Создание интернет-магазина от А до Я: https://goo.gl/7mDqYD
Создание крутого слайдера (+посадка на CMS): https://bit.ly/jVLyQ8
Все курсы в одном комплекте: https://wd-m.ru/bundle
В этом уроке мы рассмотрим создание сайта с красивым 3D эффектом. Сегодня я покажу, как происходит создание таких крутых сайтов и подробно объясню все моменты и тонкие нюансы разработки. Ключевой особенностью данного примера является реализация эффекта глубины на сайте посредством 3D перспективы. Вы удивитесь, насколько просто и быстро можно разрабатывать подобные вещи, используя современный CSS.
Страница урока: https://webdesign-master.ru/blog/html-css/parallax-3d-lens-effect-website.html
Таймкоды:
00:00 Начало урока
01:23 Обзор материалов урока
02:21 Подготовка изображений для 3D сайта
10:00 Приступаем к HTML верстке сайта
12:20 Подключаем файлы CSS и JavaScript
13:47 HTML верстка сайта (вся разметка)
20:23 Приступаем к CSS стилизации
21:43 Подключение шрифтов CSS
23:29 Стилизация тега body
24:11 Стилизация логотипа на сайте
24:52 Верстка слоев для 3D анимации
28:39 3D эффект с помощью JavaScript
35:55 Слои в 3D пространстве (глубина)
46:04 CSS стилизация контента сайта
47:41 Плавная анимация в CSS
51:37 Стилизация логотипа и текста
57:37 Верстка кнопки (button)
1:01:55 Перекрывающие слои в CSS
1:04:10 Что ещё изучить?
ВКонтакте: https://vk.com/jediweb
Телеграм: https://t.me/jediweb
Дзен: https://dzen.ru/jediweb