Como CREAR una ventana MODAL ✅ [ HTML CSS Y JavaScript ]

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

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

50% 1

Aprende a crear una ventana modal con HTML CSS y Javascript, sin frameworks, ni librerías, solamente con HTML CSS y JS puros, además de que el modal será adaptable a dispositivos móviles.
📣 ¿Necesitas un Hosting y Dominio? Utiliza el cupón "ALEXCG" hasta 90% de descuento en Hostinger.com.
ENTRA AQUÍ 👉 www.hostinger.com/alexcg
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.com/cursocss
REPOSITORIO MODAL 👉 github.com/AlexCGDesign/MODAL
-----------------------------------------------------------------------------------------------------------------------------
Aprende CSS (Desde CERO en RU-vid) 👉 • 🚀 Curso CSS PARA PRINC...
-----------------------------------------------------------------------------------------------------------------------------
CURSOS COMPLETOS:
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.com/cursocss
👨‍💻🎁 Diseño Web Desde Cero (Descuento) 👉 alexcgdesign.com/descuento-di...
-----------------------------------------------------------------------------------------------------------------------------
✉️ Redes sociales:
Blog de desarrollo web: www.alexcgdesign.com/blog
Facebook: goo.gl/7o77tx
Linkedin: goo.gl/byCJnS
Github: github.com/AlexCGDesign

Наука

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

10 окт 2021

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист

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

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

@AlexCGDesign 2 года назад

📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.com/cursocss

@Deus-lo-Vuilt 2 года назад

Gracias por ir subiendo este material

@fedemedran 2 года назад

gracias hermano vi varios y este fue el q mejor me sirvio!

@leomax522 Год назад

Espectacular explicación Alex. Muchas gracias.

@user-ce9dd5qy7m Год назад

Increíble video, muchas gracias!

@chukytoyt2513 Год назад

Explicación magistral bro , muchas gracias

@geovannygonzalez8379 2 года назад

Eso hermano cada ves mas interesante me gusta tu enseñanza sin framework

@alexxlcf 2 года назад

No había visto lo reciente que es el video, que genial el trabajo y como explicas, acabo de aplicar esto en una vista donde tengo tres modal y tres botones así que en vez de interactuar con ellos por medio de la clase lo hice con ElementById. Muchas gracias

@christs3117 Год назад

Muchas gracias, excelente video. Me saco de un apuro

@mannyanthony9130 Год назад

Perfecto el TRUCO esta en agregar a la lista y luego en quitarlo de la lista utilizando JS, ahora en ese modal se puede utilizar para lo que sea .

@willyvaldez479 2 года назад

Muy buen contenido gracias hermano lluvias de bendiciones

@carlosdanielerazo1794 7 месяцев назад

Excelente contenido, GRACIAS!!!!

@amvl7121 2 года назад

Gracias por el contenido, ayuda bastante

@gastonbarrera4164 6 месяцев назад

Gracias por este video me ayuda un monton !

@criadordeperroslostresdona9695 2 года назад

eres un grande en esto gracias por impartir enseñanza

@alejoprivera Год назад

Excelente video!!!

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

Eres un Crack estimado :)

@josedavidtellez2979 Год назад

Qué gran video, muy bien explicado y detallado de forma que es entendible, sin usar frameworks o nada. Muy buen video amigo

@ithielragnaros Год назад

perfecto un Diez hermano gracias :D ya me habia suscrito asi que un like jeje

@bryanlandazuri2610 Год назад

Excelente video. Para tener en cuenta las - - transform: / - - transition: 😊😊

@jhonatanrojasrincon5230 10 месяцев назад

Buen video 😄

@hanton08 2 года назад

Exelente explicación, tengo una pregunta, si quiero utilizar la modal para varios botones, que hay que tener en cuenta?

@user-vo1de3hr3w 11 месяцев назад

Excelente video bien explicado. Me gustaría saber como dar un efecto de como si estaría cargando el modal con un icono de reloj de arena por unos 3 segundos, para que luego aparezca el contenido, gracias

@kotomatsukami6964 2 года назад

Bro, te agradecería si hicieras ese modal con un crud. Por ejemplo en el crud visualizar una bd y al momento de insertar un nuevo registro que se abra ese tipo de modal. 😅

@eduardflores8420 Год назад

yo lo hice de la sgt manera, metí toda la estructura html del modal en un y con js lo muestro en la pagina al dar clik a un botón , luego solo remuevo el contendor con un remove () y listo , creo que está bien lo que he echo ,no ?lo único malo es que no puedo poner animaciones o eso creo

@diofaro Год назад

IMPECABLE !

@alanerik4153 Год назад

Gran video, y para tener mas dd un modal? Saludos.

@sebastian-iu1ke 6 месяцев назад

Que gran video bro, explicas demasiado bien, pero tengo un problema al momento de abrir el modal arroja un error no me reconoce la clase modal--show alguien sabe porque sucede esto??

@romuloalves9349 2 года назад

Ótimo vídeo parabéns 👍 mais se for múltiplos modals como faço.

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

Muy duro

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

excelente

@angeldavidc2132 6 месяцев назад

En vez de poner opacity 0 y pointer none, no es más fácil display none?

@rturito0013 2 года назад

Que libro de CSS recomiendas?

@alejandrodanielvaldezgrecc2530 2 года назад

geniooo

@deivi3697 2 года назад

Y el JS para almacenar que el modal esta cerrado con session storage y localStorage, como se haria?

@yessseveriano3622 Год назад

A alguien le pasa que al preisonar el boton no muestra el modal? :( help? ya hice pruebas para ver si si esta escuchando el evento y si lo escucha pero no muestra el modal

@antonioaquinodelaluz5737 4 месяца назад

Hola en el querySelector( ' modal')--> mal definido falta el punto al inicio. A mi no me lo mostraba por que dentro del query se define como una clase, es decir lleva un punto primero, forma correcta: querySelector( '.modal') posiblemente eso te falto

@soyjlc86 Год назад

parce buenas y gracias por compartir esto con todos, tengo una inquietud, hice todo el ejercicio y bien hasta que cierro el modal, resulta que el video se sigue reproduciendo en segundo plano y toca volver a abrir el modal par pausarlo y ps eso es una mala experiencia. Cómo hago para que al presionar la equis de cerrar se pause el video? y muchas gracias, ya estoy haciendo tu curso de udemy que energía