Видеозаписи лекций без обратной связи и участия преподавателя. Вы получите доступ к материалам сразу после оплаты.
Чему вы научитесь
- Понимать принципы создания эффектов и анимаций при помощи встроенных возможностей в CSS
- Научитесь работать с CSS – Анимациями, Трансформациями и Переходами
- Создавать необычные эффекты и анимации при помощи CSS
- Комбинировать между собой эффекты и анимации
- Развивать креативное мышление
Требования
- Необходимо обладать базовыми знаниями HTML и CSS
- Наличие компьютера с ОС Windows / Mac OS / Linux
- Наличие любимого редактора кода
Описание
Вы когда-нибудь видели на разных сайтах красивые эффекты или анимации?
Возникал ли у Вас вопрос: “А как это сделано?”
Хотите научиться разбираться в этом и создавать подобное, чтобы привлекать внимание к своему сайту, сделать его необычным, интересным и запоминающимся?
Тогда этот курс специально для Вас.
Курс ориентирован на разработчиков, которые уже обладают базовыми знаниями HTML и CSS, при этом было бы интересно погрузиться в мир эффектов и анимаций, а также научиться их создавать при помощи CSS-Анимаций, Трансформаций и Переходов.
В этом курсе мы разберемся в том, как устроены CSS – Анимации, CSS – Трансфомации (2D и 3D транфсормации) и CSS – Переходы, они же transitions, посмотрим на работу всех свойств, относящихся к ним и закрепим все это на специально подготовленных демках.
Зачисляйтесь на этот курс, изучайте его и вдохновляйтесь новыми идеями!
Для кого этот курс:
- Разработчики, которые хотят погрузиться в мир Web-эффектов и анимаций
Материалы курса, длительность – 02:23:35
–
Введение – 01:52
–
CSS – Переходы – 44:47
CSS-Transitions – 00:31
Свойство: transition-duration – 12:11
Свойство: transition-delay – 07:30
Свойство: transition-property – 06:17
Свойство: transition-timing-function – 09:58
Свойство: transition – 08:20
–
CSS – Трансформации – 54:50
СSS-Transformations – 00:35
Функция: translate() – 09:41
Функция: scale() – 05:45
Функция: rotate() – 03:02
Функция: skew() – 04:59
Свойство: transform-origin – 05:29
Особенности использования CSS – Трансформаций – 03:57
Перемещение в 3D пространстве – 05:46
Вращение в 3D пространстве – 05:06
Свойство: perspective – 05:38
Свойство: perspective-origin – 02:56
Свойство: backface-visibility – 01:56
–
CSS – Анимации – 42:06
CSS-Animations – 00:39
CSS-Анимации – начало использования – 08:28
Подробнее про @keyframes – 05:50
Свойство: animation-iteration-count – 03:39
Свойство: animation-delay – 03:52
Свойство: animation-direction – 05:14
Свойство: animation-fill-mode – 05:52
Свойство: animation-timing-function – 02:35
Свойство: animation-play-state – 03:37
Свойство: animation и подводим итоги – 02:20
