Финальные штрихи и анимация.
Добавь элементу div.episode-intro
относительное позиционирование.
Это позволит сдвигать нам его относительно начального положения.
И сразу спрячем наш текст - добавь свойство top
со значением 100%
.
Таким образом блок будет спрятан и до, и после анимации.
Сместим центр трансформации в точку с координатами 50%, 100%
.
Свойство animation
должно указать анимацию intro-animation
, длительностью 60s
.
Анимация должна быть линейной.
У самой анимации должно быть две точки - начало и конец.
Первый шаг меняет свойство top
на 0
, а также свойство transform
:
сначала поворот вокруг оси X на 20
градусов, и сдвиг вдоль оси Z на 0px
.
Второй шаг меняет свойство top
на -6000px
, а также свойство transform
:
сначала поворот вокруг оси X на 25
градусов, и сдвиг вдоль оси Z на -2500px
.
Эта задача — часть курса по Full-Stack JavaScript.
Ты можешь задать свой вопрос в комментариях под постом.
Если ты уже решил задачу, то не стесняйся помочь другим.