- 708
- 612 145
Topchiy Dev
Ukraine
Приєднався 1 чер 2022
Добро пожаловать на мой канал: "Topchiy Dev”, меня зовут Дмитрий. Этот канал создан с целью помочь вам в изучении программирования.
Анимация падающего вниз текста используя HTML & CSS шаг за шагом || Back in down animation CSS
👉 Animation CSS collection on Patreon: www.patreon.com/collection/817084
✔ Back in down animation CSS
В этом видео вы узнаете, как сделать анимация падающего вниз текса, блока или изображения используя HTML & CSS шаг за шагом.
Please hit the LIKE 👍, it`ll help to grow on UA-cam algorithm.
Have a nice day, GOD bless you ❤️
👍 Полезная информация для программирования и дизайна на моем телеграм-канале: t.me/TopchiyDev
💵 Поддержать канал (support channel): 5375411204111681 (universal bank || mono)
💵 Поддержать канал (support channel): send.monobank.ua/jar/3Aze2gcvVa
💵 Поддержать канал (support channel): www.patreon.com/TopchiyDev
👍 Subscribe: ua-cam.com/channels/93wVeK8kdQAHQYFjpHfFvw.html
😀Спасибо за просмотр!😀
✔ Back in down animation CSS
В этом видео вы узнаете, как сделать анимация падающего вниз текса, блока или изображения используя HTML & CSS шаг за шагом.
Please hit the LIKE 👍, it`ll help to grow on UA-cam algorithm.
Have a nice day, GOD bless you ❤️
👍 Полезная информация для программирования и дизайна на моем телеграм-канале: t.me/TopchiyDev
💵 Поддержать канал (support channel): 5375411204111681 (universal bank || mono)
💵 Поддержать канал (support channel): send.monobank.ua/jar/3Aze2gcvVa
💵 Поддержать канал (support channel): www.patreon.com/TopchiyDev
👍 Subscribe: ua-cam.com/channels/93wVeK8kdQAHQYFjpHfFvw.html
😀Спасибо за просмотр!😀
Переглядів: 57
Відео
Верстка адаптивного сайта с анимацией используя HTML, CSS & JavaScript | GYM Website Landing page
Переглядів 5029 годин тому
🔗 Исходный код (source code): www.patreon.com/TopchiyDev/shop/789982 В этом видео вы узнаете, как сделать адаптивный анимированный сайт на 8 секций footer на тему спортивного клуба Gymster используя HTML, CSS & JavaScript шаг за шагом. 🔗 Images & reset.css: surl.li/sjgtjm 🔗 AOS animations: michalsnik.github.io/aos/ 🔗 Deploy website: www.netlify.com/ 🕛Timemarks🕛 4:47 - reset.css 6:08 - add varia...
Как добавить заливку и обводку для изображения с помощью SVG || Fill and stroke for image using SVG
Переглядів 12516 годин тому
👉 Support me on Patreon: www.patreon.com/c/topchiydev/membership В этом видео вы узнаете, как добавить заливку и обводку для изображения спомощью SVG. 🔗 Images: surl.li/zocitb 🔗 SVG to Code | Online converter: nikitahl.github.io/svg-2-code/ ✔ SVG to code converter ✔ Fill and stroke for image using HTML & CSS step by step Please hit the LIKE 👍, it`ll help to grow on UA-cam algorithm. Have a nice...
Как сделать анимацию бьющегося сердца на чистом CSS || Heart Beat animation using HTML & CSS
Переглядів 9621 годину тому
👉 Animation CSS collection on Patreon: www.patreon.com/collection/817084 🔗 Исходный код (source code): www.patreon.com/posts/117825073 ✔ Heart Beat animation CSS В этом видео вы узнаете, как сделать анимацию бьющегося сердца используя HTML & CSS шаг за шагом. Please hit the LIKE 👍, it`ll help to grow on UA-cam algorithm. Have a nice day, GOD bless you ❤️ 👍 Полезная информация для программирован...
Как сделать слайдер карусель для Team Section HTML, CSS & JavaScript | Responsive owlCarousel slider
Переглядів 160День тому
👉 Support me on Patreon: www.patreon.com/c/topchiydev/membership 🔗 Исходный код (source code): www.patreon.com/posts/117825021 В этом видео вы узнаете, как сделать адаптивный слайдер карусель используя HTML, CSS & JavaScript owlCarousel jQuery шаг за шагом. 🔗 Images: surl.li/rxdhja 🔗 OwlCarousel link: cdnjs.com/libraries/owl-carousel 🔗 jQuery link: cdnjs.com/libraries/jquery 🕛 Time-marks 🕛 02:0...
Анимация желе для элемента используя HTML & CSS || Jello animation CSS
Переглядів 8914 днів тому
👉 Animation CSS collection on Patreon: www.patreon.com/collection/817084 🔗 Исходный код (source code): www.patreon.com/posts/117824969 Jello animation CSS step by step В этом видео вы узнаете, как сделать анимацию с эффектом желе используя HTML & CSS анимации шаг за шагом. Please hit the LIKE 👍, it`ll help to grow on UA-cam algorithm. Have a nice day, GOD bless you ❤️ 👍 Полезная информация для ...
Свойство animation-fill-mode в CSS || Animation-fill-mode property in CSS || Full CSS course
Переглядів 9214 днів тому
В этом видео уроке вы узнаете, что такое свойстов animation-fill-mode и узнаете, как оно работает и применяется на примерах. In this video tutorial you will learn what the animation-fill-mode property is and how it works and is applied with examples. Please hit the LIKE 👍, it`ll help to grow on UA-cam algorithm. Have a nice day, GOD bless you ❤️ 👍 Полезная информация для программирования и диза...
Как сделать анимированный бесконечный слайдер с логотипами компаний HTML & CSS animations
Переглядів 23314 днів тому
👉 Support me on Patreon: www.patreon.com/c/topchiydev/membership 🔗 Исходный код (source code): www.patreon.com/posts/117824912 В этом видео вы узнаете, как сделать анимированный бесконечный слайдер с логотипами компаний используя HTML & CSS animations шаг за шагом. In this video you will learn how to make an animated infinite slider with company logos using HTML & CSS animations step by step. 🔗...
Анимация колебания для элемента HTML & CSS || Wobble animation CSS step by step
Переглядів 8821 день тому
Анимация колебания для элемента HTML & CSS || Wobble animation CSS step by step
Свойство animation-play-state в CSS || Animation-play-state property in CSS || Full CSS course
Переглядів 10121 день тому
Свойство animation-play-state в CSS || Animation-play-state property in CSS || Full CSS course
Как добавить счётчик показателей на сайт HTML, CSS & JS | CounterUp Numbers using counterup.js
Переглядів 24921 день тому
Как добавить счётчик показателей на сайт HTML, CSS & JS | CounterUp Numbers using counterup.js
Tada animation CSS using HTML & CSS step by step
Переглядів 6728 днів тому
Tada animation CSS using HTML & CSS step by step
Свойство animation-direction в CSS || Animation-direction property in CSS || Full CSS course
Переглядів 84Місяць тому
Свойство animation-direction в CSS || Animation-direction property in CSS || Full CSS course
Кнопка с волновым эффектом при клике HTML, CSS & JavaScript || Button with ripple effect on click JS
Переглядів 158Місяць тому
Кнопка с волновым эффектом при клике HTML, CSS & JavaScript || Button with ripple effect on click JS
Анимация раскачки для элемента HTML & CSS || Swing animation CSS
Переглядів 95Місяць тому
Анимация раскачки для элемента HTML & CSS || Swing animation CSS
Свойство animation-iteration-count в CSS || Animation-iteration-count property in CSS || Full CSS
Переглядів 85Місяць тому
Свойство animation-iteration-count в CSS || Animation-iteration-count property in CSS || Full CSS
Эффект наложения при наведении откидывать вверх изображение HTML & CSS | Hinge up overlay effect CSS
Переглядів 213Місяць тому
Эффект наложения при наведении откидывать вверх изображение HTML & CSS | Hinge up overlay effect CSS
Анимация встряхивания по горизонтали и вертикали для элемента CSS || ShakeX and ShakeY animation CSS
Переглядів 70Місяць тому
Анимация встряхивания по горизонтали и вертикали для элемента CSS || ShakeX and ShakeY animation CSS
Свойство animation-delay в CSS || Animation-delay property in CSS || Full CSS course
Переглядів 82Місяць тому
Свойство animation-delay в CSS || Animation-delay property in CSS || Full CSS course
Адаптивная галерея с фильтрами HTML, CSS & JavaScript || Responsive filterable gallery using Isotope
Переглядів 215Місяць тому
Адаптивная галерея с фильтрами HTML, CSS & JavaScript || Responsive filterable gallery using Isotope
Свойство animation-timing-function в CSS || Animation-timing-function property in CSS
Переглядів 98Місяць тому
Свойство animation-timing-function в CSS || Animation-timing-function property in CSS
Эффект наложения при наведении используя HTML & CSS шаг за шагом | Overlay Effect on hover using CSS
Переглядів 217Місяць тому
Эффект наложения при наведении используя HTML & CSS шаг за шагом | Overlay Effect on hover using CSS
Как сделать боковое вертикально меню используя HTML, CSS & JavaScript || Sidebar navigation menu JS
Переглядів 328Місяць тому
Как сделать боковое вертикально меню используя HTML, CSS & JavaScript || Sidebar navigation menu JS
Анимация вспышки для элемента HTML & CSS || Flash animation CSS
Переглядів 159Місяць тому
Анимация вспышки для элемента HTML & CSS || Flash animation CSS
Эффект наложения при наведении на чистом HTML & CSS || Overlay effect on hover using HTML & CSS
Переглядів 182Місяць тому
Эффект наложения при наведении на чистом HTML & CSS || Overlay effect on hover using HTML & CSS
Адаптивный двойной header используя HTML, CSS & JavaScript || Responsive double header using JS
Переглядів 2472 місяці тому
Адаптивный двойной header используя HTML, CSS & JavaScript || Responsive double header using JS
Кнопка наверх которая отображается при прокрутке страницы вниз HTML, CSS & JavaScript || Scroll Up
Переглядів 3162 місяці тому
Кнопка наверх которая отображается при прокрутке страницы вниз HTML, CSS & JavaScript || Scroll Up
How to create CSS Ribbon using only HTML & CSS
Переглядів 1662 місяці тому
How to create CSS Ribbon using only HTML & CSS
Свойство animation-duration в CSS || Animation-duration property in CSS || Full CSS course
Переглядів 632 місяці тому
Свойство animation-duration в CSS || Animation-duration property in CSS || Full CSS course
Наверное мой комментарий уже не так важен на данный момент, но все же я хочу им поддержать канал, удачи!
Спасибо большое 🙂 Каждый комментарий очень важен, это очень ценно для меня 😃 Спасибо за обратную связь 👍
thanks 🙏
Пожалуйста 👍
😆.
Дмитрий здравствуйте. Подскажите почему иногда иконки font-Awesome отображаются не корректно? например в виде квадратика....(((
Приветствую! Одна из причин, это потому что они входят в платную версию или возможно на самом устройстве нет поддержки, знаете как бывает, когда шрифт не отображается из-за того, что его не поддерживает устройство. Попробуйте к иконке добавить свойство font-family: “fontAwesome”; возможно это сможет помочь.
Благодарю! Ещё с фитнесом работаю!
Ничего всему свое время) До этого еще дойдете 👍🙂
😎👍
👍🙂
Спасибо !
Пожалуйста 👍
Спасибо большое! Выгрузка сайта была последним моим условием для автомата по информатике!!! Видео очень выручило!!!
Пожалуйста 👍
Существует ли макет?
Приветствую! Нет.
😆
Огонь , классное видео! Спасибо 👍
Пожалуйста 👍
Доброго времени суток! Хороший сайт - хороший урок. Нужна помощь в верстке по проекту лендинга на гридах!
Приветствую! Спасибо за обратную связь 👍 Некоторые секции в этом примере созданы с помощью grid, может это поможет. Со временем постараюсь записать подробные разборы на примерах с применением grid.
Спасибо за rem! Интересно было бы послушать, как на лету переводите из px. Ведь макеты все идут в px или как и я с помощью плагина "px to rem". Жду также на tailwind 😇. Успехов вам!
Приветствую! Пожалуйста 👍 Может это видео поможет лучше понять: Единица REM в CSS - детальный разбор ua-cam.com/video/Qj5mBnC5mCg/v-deo.html
спасибо тебе! пролистал 100 видео ты единственный кто помог! подписка!
Пожалуйста) Рад, что смог помочь 👍
Неимоверно круто. Очередное офигенное обучающее видео. Самые модерновые элементы верстки на простом, понятном языке. Огромная работа, чтобы показать примеры таких актуальных решений. Когда он успевает? Потрясающий результат. Спасибо.
Спасибо за обратную связь 👍😀
Здравствуйте, а вы можете пожалуйста, сделать видео про Sass ? Заранее благодарю!
Приветствую! Возможно со временем сделаю, сейчас пока нет такого в планах.
Добрый вечер! На RUTUBE не планируете? UA-cam тормозит постоянно.
Приветствую! Нет.
@topchiydev Понял, спасибо! Жаль, очень доступно объясняете!
Спасибо 👍
Ютуб совсем перестал работать😮
Доброго времени суток! Благодарю! Теперь есть чем неделю занять!!!
Приветствую) Пожалуйста 👍
😎👍крутяк!
Спасибо 👍
Здравствуйте, а у вас есть видео по создание кнопок Whatsapp, Telegram ?
Приветствую! Пока нет, подумаю над этим, спасибо.
Спасибо огромное!
Пожалуйста 👍
thanks 🙏
Пожалуйста 👍
Объективная оценка ролика 8/10 (из-за звука). Субъективная 10/10 (мне звук не мешает). Автору желаю иметь меньше багов и продолжать быть здоровым человеком (то есть не нуждаться в "костылях").
Спасибо большое за обратную связь 👍 Вам также всего самого наилучшего 🙂
Здравствуйте , а можете сделать тоже самое только с картинкой ,я просто не догоню как)
Приветствую! К тегу img или к классу для картинки, задайте свойства анимации, также как к тексту или блоку.
как получить исходный код не в патреоне
Приветствую! К сожалению, никак.
😆
4:47 а нельзя просто box-shadow?
Просто box-shadow не сработает, нужно через filter.
👍 👍 👍 👍 👍 👍
👍🙂
thank you bro
Welcome 👍
Свг пихать кодом в хтмл -не тру... А зачем конвертор, если можно открыть свг в ВСкод и вот тебе её код?..
Приветствую! SVG в HTML это нормальная практика. Второй момент в том, что у меня есть картинка в формате SVG и мне нужно получить с этой картинки код, поэтому использую конвертор.
Что-то я тебя не совсем понял, ведь свг - это уже код который можно вписать в хтмл, жду шортс на эту тему!)
@topchiydev да, я кстати не поздоровался( Здравствуй)
Все верно SVG это код, но допустим у меня есть картинка в формате svg и я хочу узнать код этой картинки, для этого я использую конвертор, который делает из картинки код и наоборот из кода картинку, как в видео.
Дякую вам Дмитре, як завжди щось цікаве , будьте здорові !
Будь ласка 👍 Дякую і вам теж всього найкращого 🙏🏻
Класс! Что-то новенькое!!!
Спасибо 👍
😎👍
👍🙂
Z-index что бы он был выше остальных, нужно тупо задавать очень большое значение? А есть какое то специальное значение, которое в принципе выше остальных, т.е. такое значение при котором все остальны элементы какими бы большими зэтиндексами они не обладали, были все равно ниже, чем этот, у которого задано «специальное» значение?
Приветствую! Можно задать специальное значение для z-index: 9999999; тогда все остальные будут ниже. Такое значение обычно применяют при создании фиксированного меню, чтобы меню перекрыло все остальные элементы на странице.
thanks 🙏
Пожалуйста 👍
😆
Благодарю!
Пожалуйста 👍
😎👍
👍🙂
😁😁
👍🙂
👏
👍🙂
😆
🙂
thanks 🙏
Пожалуйста 👍