Анимация спрайта на CSS на примере персонажа.
ฝัง
- เผยแพร่เมื่อ 28 ก.ย. 2024
- В данном виде мы научимся анимировать спрайты на примере анимации персонажа. С помощью спрайтов можно добавить любой визуальный эффект на сайт.
Все исходные материалы Вы можете посмотреть по ссылке:
antonaniskovic...
🤲 Поддержать канал, и получить бонусы (Патрион):
/ aniskovich
🌐 Мой сайт:
antonaniskovic...
🔥 Я в соц. сетях:
/ aniskweb
m010k0
Ты крут! Лучший блогер по css, все задания сделал! И сохранил) жаль что канал забросил, ты лучший учитель, СПАСИБО!!!
Получилось, спасибо за видео!)
Я очень рад. Пожалуйста.
Прикольно, спасибо!
Пожалуйста
@@m010k0 подскажите пожалуйста, что дописать в код, чтобы анимация срабатывала когда на нее наводишь курсор?
Стили анимации прописать для состояния :hover
@@m010k0 спасибо!) работает
А как можно сделать резку смену кадра?
У меня все изображения объединены в спрайт вертикальный и выходит так, будто это слайдер.
А я хочу что-бы позиция менялась резко, но временной промежуток между сменой кадров был 0.4s
Вроде всё сделала по уроку, НО у меня почему-то во время движения картинки (спрайт другой выбрала) вылазит обрезанная часть предыдущего/следующего слайда. Не могу понять что не так? Ширину неправильно задала? Но вроде игралась с ней и больше и меньше делала, но все равно какая-то фигня получается((( Что не так может быть?
Если скинете код и спрайт могу посмотреть. А так очень сложно сказать.
Salam aleykum(мир вам), как сайт называется каторый вы начало видео показывайте .
Яндекс картинки)))
Пытаюсь сделать другой спрайт. Но картинка почему как-бы приподнимается. Кто-нибудь знает почему так?
К каждому спрайту нужно подбирать параметры анимации.
Очень хорошо и подробно объяснил. Спасибо за видео. Лайк
Пожалуйста!
Что делать ,если у меня картинка трехэтажная ( эффект взрыва ) и анимация идет сверху вниз ,как сделать ,чтобы смена кадров шла горизонтально
Смещение спрайта можно задавать любое. В свойствах анимации.
Спасибо.
Подскажи пожалуйста почему он не уменьшается при изменении экрана?
Как сделать бесконечную пингпонг анимацию? (Когда анимация нарисована только в одну сторону)
Урок был посвящён анимации патерна. И пример, как можно эту анимацию реализовать. Тут нет адаптации к мобильным устройствам, так как это вообще другая тема. Адаптировать можете любым способом. Чтобы сделать анимацию персонажа в одну, а потом в другую сторону, нужно добавить еще одну контрольную точку в анимации и когда персонаж идет в другую сторону нужно отражать персонажа по горизонтали.
Спасибо большое, за классный видос!)
Пожалуйста
как сделать , чтобы смурфик ходил направо и налево ?
Поменяйте направление анимации и отрозите картинку по горизонтали.
ещё ангел ходит с смурфиком, только эти милашки в одну сторону ходют. ангела в фотошопе отразил горизонтально и animation-direction: reverse; и все 16 ангелов полетели налево, хотел одного, а не 16.
Отразить можно и с помощью css. Чтобы ангел ходил один, нужно применить эти действия только к одному ангелу. Например, сделать его отдельным изображением.
где находить спрайты что бы они шли в одну сторону а не в ряды?
👍
Спасибо=)
Отличный урок.!!! Спасибо
Пожайлуйста =)
супер!
Спасибо!