CSS анимация для самых маленьких. Анимация логотипа на миллион долларов

2407 ratings | 45199 views


CSS анимация для самых маленьких. Анимация логотипа на миллион долларов

Полезно? Подпишись - Текстовая версия, исходники и демо: Приветствую, друзья! Сегодня мы рассмотрим интереснейшую тему - создание CSS анимаций на реальном примере. Кульминацией данного урока будет создание красивой CSS анимации логотипа на миллион долларов. Создание интернет-магазина от А до Я: Как стать фрилансером: Создание сайта-портфолио на WordPress: Группа Вконтакте: Реклама на канале:

Comments to the video: CSS анимация для самых маленьких. Анимация логотипа на миллион долларов

Just want TF2 hats 26 days ago
Алексей, запишите видео Github для самых малеханьких ? Расскажите в нем, будто настроить работу с репозиторием чрез командную строчку. А то в ручную оттуда даже папку выслать геморно.
Дмитрий Борщевский 1 month ago
Почему вспышка срабатывает 2 раза? Почему кушать поменять в стилях для logo-border border-radius то, когда сработает вспышка, применится конкретно этот border - radius , а не тот что задан в анимации?
Дмитрий Борщевский 1 month ago
точно, благодарю огромное)
WebDesign Master 1 month ago
Потому, что 1-ый один срабатывает в процессе forward, 2-ой - backward.
Влад Свидрицкий 1 month ago
если задать border-radius для animateborder не 10em, а 50%, то сначала возникает не сферы. будто это осознавать?
WebDesign Master 1 month ago
Смотря в каких единицах это свойство задано в конце анимации.
Крошка ТВ 1 month ago
С наслаждением присоединились к числу подписчиков вашего канала.
Денис Лотоцкий 1 month ago
Лучший, все доступно и весьма отменно ! Спасибо большущее
Yuriy Lunyov 2 months ago
Отличный задание! Спасибо огромное :)
Другое TV 2 months ago
Рамачка :D Кто Жизнь в другом мире с 0 смотрел - усвоит :D
Диас Байгозин 2 months ago
Качественный контент. Спасибо!
John DaRT 2 months ago
Что за программка?
John DaRT 2 months ago
Истории программера благодарю
Истории программиста 2 months ago
Это не программка. Это - Требуется регистрация, однако она бесплатная.
Александр Чигарев 2 months ago
Супер задание, благодарю большущее.
ИгорьК как 2 months ago
Как изучаю на данный момент css для творение собственного веб-сайта и задумывался что css лишь для редактора странички!Но анимация)Не ждал!
Artem Ermakov 2 months ago
Спасибо.
Ярослав Три 2 months ago
адобеееееее
WebDesign Master 2 months ago
Э-ДО-БИ
Игорь Степанов 2 months ago
Крутотень! Автору благодарю за подробное объяснение!!
Ciobanasu Ion 3 months ago
Что за редактор используете и что за плагины для этого редактора ? Спасибо.
Ciobanasu Ion 3 months ago
Спасибо
WebDesign Master 3 months ago
Viacheslav Sheviakov 3 months ago
Одна из самых подробных и высококачественных подач материала. Урок отлично понятен будто новенькому, этак и человеку уже работающим с WEB. Спасибо создателю! Лайк
Крыса 3 months ago
За что люблю твои уроки - практика на примерах. Свойства анимаций я знаю, что они обозначают тоже, однако вот будто их прикольно применить - это другое :)
Giuseppe Ibanuzzo 3 months ago
Ты мега крут!
The Anatolich 3 months ago
Не сообразил прикол с _vars.sass.Почему мы брали оттуда некие смысл,множили???
The Anatolich 3 months ago
Timur Savvin аа,сообразил, благодарю:))
Timur Sharifyanov 3 months ago
Чтобы потом, если придётся поменять размер иконки, то поменять не в нескольких местах, а итого в одном, при этом сохранятся все пропорции :)
Mera Networks 3 months ago
не усвою 1-го - отчего Sublime Text именуется у создателя ex. ex -допотопный текстовый редактор на *nix системах, вряд ли кому он на данный момент служит :)
Danil Zaveryukha 1 month ago
ex - это имя директории в которой работал создатель
Евгений Ермолаев 3 months ago
ТЫ ПЕРЕШЕЛ НА МАК!1
Anthony Soup 3 months ago
Извините, что проблема не по теме. У меня появилась неувязка с посадкой маленького шаблона на вордпресс. У меня кушать готовый штамп Главной странички, штамп странички для Новостей (тоесть будто отдельная страничка для блога на веб-сайте) и штамп странички для Открытой анонсы (самой записи). Записи в блоге удачно выводятся на страничке новостей, однако будто лишь я открываю эту новинка, меня попросту выбрасывает по ее ссылке, однако не на ее нормальную страничку записи, а на штамп главной странички. Тоесть по сущности, мне надлежит обнаруживать страничку шаблона открытой анонсы для этой записи, а меня отсылает на эту запись, которая типа записана на страничку шаблона главной странички. Подскажите, будто сделать этак, чтоб при открытии поста из странички новостей меня ссылало на открытую новинка под шаблоном странички, которая была сверстана конкретно для записей? Возможно я очень хреново обрисовал делему, однако если кушать возможность, помогите
Ольга Унгурян 3 months ago
А будто ввести пакет node.js на Windows? Чем поменять команду New terminal here
Dastan Abeuov 3 months ago
spasibo LOGOTIP nashei organizacy animiroval vse na rabote rady ) like + and Hand up !
Илья Климов 3 months ago
Благодарю за задание. Всё попросту любо :) Вы молодчина!
Простые рецепты Толяна 3 months ago
Алексей хорошего времени, что вы думаете по поводу postcss?
traveler 3 months ago
всем привет!ребята растолкуйте юному не опытнейшему ,вот я скачал макет в формате PSD что далее ?закинуть нужно в фотошоп? а в файлы где html css и т.д нужно его кидать либо дудки?одним словам с чего начинают вёрстку макетов веб-сайта?я быстро смотрел видео ролики,там уже макеты были в фотошопе и создатель начинает к примеру строчить тежи фразы что и в макете,за чем? не проще скопировать и воткнуть фразы с макета?либо этак невозможно сделать?
traveler 3 months ago
благодарю посмотрю.
WebDesign Master 3 months ago
Посмотрите джедай вёрстки 6.
Jason Yankee 3 months ago
А что если заместо opacity устанавливать display: none?
Jason Yankee 3 months ago
Спасибо. Like за задание!
WebDesign Master 3 months ago
Это свойство не имеет переходных состояний.
Денис Буров 3 months ago
Лучшие уроки! Спасибо!
brin gonor 3 months ago
Алексей круто !!!
Freisent Klod 3 months ago
Ребят подскажите отчего bootstrap.psd по ширине 1170, ведь даже самое юзабельное позволение 1366х768, не говоря уже о 1920х1080
Alta Axmetov 3 months ago
+++++++++++++++++++++++++++++
Александр Задолбали 3 months ago
а если градиент зациклить не ввысь книзу. а по кругу. какой код, подскажите?
Владимир Костенко 3 months ago
Ребят, может проблема будет глуповатым.однако я не совершенно сообразил будто Александр определяет % в keyframes
Владимир Костенко 3 months ago
конечно нее) это то понятно) уместно вот отыскал сервис по генирации keyframes! !/ %2F
Антон Ушаков 3 months ago
Владимир Костенко % это временная шкала, 0 - начин 100 - крышка ,считай у тебя кушать 100 ячеек и в каждой ячейке происходит поступок, будто комиксы отрисовывают на страничках в учебниках принцип тот же)если я верно сообразил проблема
MATTIAS TV 3 months ago
Знайте я увеличивал и уменьшал лого инста, и огромных размеров смотрится этак для себя, отчего бы не привязать смысл border к $box_h? Это бы лучше смотрелось на огромных размерах.))0)))
MATTIAS TV 3 months ago
Такс нужна поддержка, выдает ошибку Error: Invalid CSS after .eft: -$box_h/2; : expected , was $::after on line 63 of app/sass/main.sass >> margin-left: -$box_h/2; ------------------------^
KriPtoN First 3 months ago
неувязка в отступах
MATTIAS TV 3 months ago
Знайте неувязка вроде бы отважилась однако я не понимаю её причину, попросту вроде бы всё идиентично вводил, однако у меня не работает, а у скопированное работает( кто знает причину скажите изволь!
Anton Noginov 3 months ago
леша привет. я естественно не в тему, однако у меня к для тебя кушать проблема насчет монитора. Купил монитор для себя Dell UltraSharp U2414 , мне произнесли , что он для дизайнера. поварачиваеться в различные стороны, однако кушать миниус его по тянуть на стенку невозможно. Можешь про него что нибудь произнести. Мне приглянулся тем что он без рамочный и узкий
Alexandro Lavichez 3 months ago
Anton Noginov всем похуй на твой монитор, лох
Igor Rudnev 3 months ago
чувак ты весьма крут! лоис
Infernituum — Игро-Творческий канал 3 months ago
Привет! Что за шрифт ты используешь в саблайме?
Богдан Гомон 3 months ago
Спасибо огромное! Супер!
Habu Nikita 3 months ago
Спасибо за видео
Галина Моисеева 3 months ago
Не для чайников , а этак по-хорошему для самых малеханьких ))) Ты самый крутой)) Спасибо за крутые и понятные уроки) Лайк еще до просмотра)
Asylzhan.B NH 3 months ago
фиолетовая какашечка )))) ничего подобного не слышал в жизнею
Дмитрий Середюк 3 months ago
Классно! На часах 05:50, просмотрел не зевнув, благодарю!
Михаил Колоколуша 3 months ago
это что то с чем-то! ты господь) всё весьма прекрасно и максимально понятно;) спасибище большущее!!!
Danil Sumarokov 3 months ago
весьма приметно улучалось качество видео стало более плавненько более прекрасное что ле)) в общем макентош дает о для себя знать)
Олег Бондаренко 3 months ago
боже будто же угодить к вам на обучение,либо укажите линия изволь,куда рыть,с чего приступить.
Vadym Volos 3 months ago
Вместо ручного написания кода для сотворения анимации можно испытать Google Web Designer.
Сергей Михеев 3 months ago
это шедеврально!! чес слово!!
Iuliia Shpak 3 months ago
живи 100 лет, всерьез!) Столько времени находила адеквантные видеоуроки без воды и с пригодными примерами, а здесь этот канал - попросту мое спасение
Лойсо Пондохва 3 months ago
Я юноша обычный. Вижу Лехин видос, ставлю лайк:)
Alex Vest 3 months ago
Как именуется твоя тема в Sublime Text?
WebDesign Master 3 months ago
One Dark Material Theme.
daemon named 3 months ago
Boxy
Terra Key 3 months ago
Скажи изволь, какая операционная система у тебя стоит? Или их несколько?
Terra Key 3 months ago
Спасибо!
WebDesign Master 3 months ago
На MacBook - macOS, на iMac - macOS и Windows 10, на ПК ноутбуке - Windows 10 и Ubuntu, на 2-х планшетах и 2-х телефонах в семье - iOS.
Terra Key 3 months ago
ios не может быть, поэтому что ios лишь для айфонов и айпадов. Скорее MacOs. И хотелось бы выяснить сколько их итого
Rodion Hryhorenko 3 months ago
IOs
Роман Дунаев 3 months ago
Спасибо!!
Alexey Shadows 3 months ago
Надо было сделать, что бы точка до вспышки становилась красноватой (для исключения эффекта бардовых глаз).
Alexey Shadows 3 months ago
Столько терпения у создателя - супер.
Alexey Shadows 3 months ago
Не знаю кому будто, а мне мешают кривые руки ))
Максим Смирнов 3 months ago
Просто боженька! Спасибо мужчина! :)
ekzo 3 months ago
Красота)
Andrey Onoprienko 3 months ago
Лучшие уроки по интернет-разработке, весьма приятно глядеть ваши видео, все схватывается на лету, благодаря вам научился мастерить потрясающие вещи, большущее благодарю!!!
MrOne865 3 months ago
Секс. Реально круто)
Alex Terrenas 3 months ago
Диз поставил тот у кого не выходит))
Billie Willie 3 months ago
Алексей, bootstrap 4 ожидает вас)
daemon named 2 months ago
Для продакшена это покамест не вариант, как досадно бы это не звучало.
Edward Ilyaskin 2 months ago
Все же это не достаточно.
Роман Белов 3 months ago
*Yurii, уже 66% поддерживает сетку, этак что уже можно запускать*
Yurii Taran 3 months ago
Рано. Поддержка браузерами еще очень слаба.
Роман Белов 3 months ago
*бутстрап??? забудь о нем, будто о ужасном сне! их пора ушло! grid layout, вот что вправду заслуживает внимания!!!*
асыл нарматов 3 months ago
лайк не смотря. я длительно ожидал!!!
Nikita P 3 months ago
Вот лишь решил взяться и нормально выучить CSS Анимацию, перезагружаю страничку и вижу ролик от тебя. Спасибо)
Denying Mad 3 months ago
Nikita P хах, такая же ситуация)
Panichev Aleksey 3 months ago
Хоть я и тупоумный и не опытнейший (2 месяца практики) однако мне было все понятно))) Спасибо за задание)))
KillerTime html-coder 3 months ago
нифига се круто :)
Безмятежный Челик 3 months ago
Наконец-то. Лайк и Респект.
Paco Official 3 months ago
ооо годнота подъехала))
Василий Пупкин 3 months ago
неплохой пёсик, тяфкни ещё.
Paco Official 3 months ago
пес а ты что здесь забыла)) иди уроки делай на лето
Василий Пупкин 3 months ago
пуко слитый лох, тяфкни выше
Евгений Ращупкин 3 months ago
Фиолетовая какашечка
Мансур Бирюков 3 months ago
Еще никто не называл амперсенд этак весело
Eugene Veprytskyi 3 months ago
Фиолетовая какашечка +100500
Technika shop 3 months ago
я даже вспять перемотал, чтоб осознать, не послышалось ли)
MATTIAS TV 3 months ago
Шо за прога? я вообщем не шарю(
SANYOK MURYY 3 months ago
Михаил Завалко 3 months ago
Я человек обычный.ну-ка далее все знают 👍👍👍
Константин Олещук 3 months ago
Наконец-то ты возвратился)
Haleluya 3 months ago
Лайк
Mr. Hyde 3 months ago
Лайк не смотря.
rimo rur 1 month ago
++++!
Ivan Venediktov 3 months ago
Автора в президенты!
Maga Loss 3 months ago
++
Лойсо Пондохва 3 months ago
+