No video :(

¡Aprende a utilizar TRANSICIONES CSS!

Подписаться 19 тыс.

Просмотров 6 тыс.

50% 1

Los efectos e interacciones en una página web sin transiciones son estáticos y aburridos. ¡Aprende a utilizar las transiciones CSS y descubre como crear tus propios efectos de forma muy sencilla sólo aplicando alguna que otra propiedad CSS a tu código!
¡Te lo explico!
TIMELINE:
00:00 Introducción del ejemplo sin transiciones
01:38 Añadir transiciones CSS
03:20 Transición de atajo (shorthand)
05:00 Transición de entrada y de salida
05:46 Truco para no transicionables
07:35 Retraso de transición (Delay)
09:15 Cierre
LINKS:
👀 Transiciones CSS: lenguajecss.com/css/animacion...
👀 Imágenes y gradientes: lenguajecss.com/css/colores-y...
👀 Demo Buzz Lightyear (final): manzdev.github.io/twitch-buzz...
¡No te olvides de seguirme! ⚡ manz.dev
---
📹 Twitch: / manzdev
📼 RU-vid: / manzdev
🐤 Twitter: / manz
📷 Instagram: / manz.dev
✈️ Telegram: t.me/ManzDev
🎶 Música del final: ncs.io/

Опубликовано:

12 авг 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 41

@usuario_4778 2 месяца назад

Buen video. Una forma de explicar bastante buena. Gracias por compartir su conocimiento

@suskoooo Год назад

Que satisfacción sientes al entender todo lo que te dice y no simplemente copiar y pegar uff la pagina da mucha info y con sus videos tambien son una muy buena guia para seguir aprendiendo mas. excelente trabajo

@ManzDev Год назад

¿A qué si? Muchas veces con las prisas de aprender rápido aprendemos solo lo que queremos hacer el momento, pero pararnos a comprender como funcionan las cosas, ¡es mucho más efectivo a la larga! ¡Gracias por el comentario, amigo! ❤

@cerm88 Год назад

Esto es una clase avanzada, nunca lo había visto de esta manera. Excelente!

@ManzDev Год назад

¡Muchas gracias, Carlos!

@borgg3037 Год назад

Que manera de explicar... Manz, da gusto!

@ManzDev Год назад

¡Muchísimas gracias, Bor GG! 🙏

@lucasgazzola Год назад

Excelente, Manz! Te acabo de descubrir, voy a ver más de tus videos!

@ManzDev Год назад

¡Muchísimas gracias, Lucas! Estoy subiendo videos a RU-vid varios días a la semana y también tienes las páginas de documentación que tienes en la parte superior de manz.dev/ ¡Saludos!

@eliecersmora5931 5 месяцев назад

Crack. Sigue con estos tutoriales por favor!! saludos

@ricardohernandezmendez4207 Год назад

Excelente explicación al igual que el de animaciones. Gracias Manz!

@ManzDev Год назад

¡Gracias a ti por tomarte el tiempo en comentar, Ricardo! Te lo agradezco mucho

@rolandobrandan9621 Год назад

Geniaal excelente explicacion!! Algo asi fue lo que hiciste cuando hiciste la animacion del sable de Star Wars?

@ManzDev Год назад

¡Exacto! Una transición es cuando se cambia de un estado a otro (en el caso del sable, "encendido" / "apagado" (con clases por ejemplo). ¡Saludos!

@BlancaTF 11 месяцев назад

Qué bien y clarito lo explicas todo, jomío! muchas gracias por tu video. Me suscribí! 🥰

@ManzDev 11 месяцев назад

¡Muchísimas gracias! 😍

@lucasnrodriguez 9 месяцев назад

GENIO, CRACK, ÍDOLO

@ManzDev 9 месяцев назад

¡Gracias, Lucas! 🦾

@giovannivoltaproxy Год назад

Que buen contenido fui el sábado a un Stream por twitch revise sitio muy clean y ahora estoy tomando nota un Markdown y entendiendo mejor las propiedades 💫

@ManzDev Год назад

¡Muchísimas gracias, Giovanni! 🚀

@yessicamendoza5260 11 месяцев назад

Primera vez que llego a tus videos, excelente contenido, no pudiste explicarlo mejor! Me ayudaste, encontré lo que buscaba. Sin embargo para mi estilo de aprendizaje encuentro muchos distractores, muñequitos moviendose abajo, mensajes entrando, muñecos que salen flotando por todos lados, etc. por momentos me llegué a sentir un poco mareada :P Por lo demás todo muy bien!!

@ManzDev 11 месяцев назад

¡Yessica, gracias por tu feedback! El mundo de Twitch es totalmente diferente al mundo de RU-vid, soy consciente. En una plataforma se busca contenido fresco, dinámico e interactivo, y en la otra plataforma se busca más un contenido guionizado, preparado y enfocado. Muchas veces me he preguntado si debería crear contenido sólo y exclusivamente para RU-vid, pero actualmente por el tiempo me resulta imposible, por lo que edito los videos de los directos de Twitch para aprovechar lo que hacemos en una plataforma y llevarla a otra. Pensaré a ver si se me ocurre alguna solución, aunque es complejo.

@ManzDev 11 месяцев назад

Aprovecho también para remarcar que por LenguajeCSS tienen contenido escrito, un poco más enfocado y explicado en detalle: lenguajecss.com/css/animaciones/transiciones/ 🚀

@yessicamendoza5260 11 месяцев назад

@@ManzDev Wow! Que amabilidad!Muchas gracias!😍 Ya tienes una seguidora más!😊 Saludos desde Colombia 👍

@federicoaldana5952 Год назад

El mejor Css de Latinoamérica.

@ManzDev Год назад

🚀🚀🚀

@mr.fabian8471 Год назад

gracias master!

@ManzDev Год назад

¡Muchas gracias, Fabian!

@soyjonathan. Год назад

Enseñas muy bien css

@ManzDev Год назад

¡Gracias, Jonathan!

@zero2186 Год назад

Que buen video me recomendó iutub, me sirve demasiado para mi aprendizaje 😁, una preguntita alterna. Que extensión usas para que se vean ese tipo de chispas cuando escribes?

@ManzDev Год назад

¡Hola Onix! ¡Muchas gracias! La extensión que comentas se llama "Power Mode", por aquí tienes todas las que uso: manz.dev/software/vscode/ Y por acá un directo resubido donde explicamos todo lo referente a Vscode: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-kjwbop9G0F0.html ¡Saludos!