Como CREAR una ventana MODAL ✅ [ HTML CSS Y JavaScript ]
Вставка
- Опубліковано 8 лют 2025
- 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....
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.c...
REPOSITORIO MODAL 👉 github.com/Ale...
-----------------------------------------------------------------------------------------------------------------------------
Aprende CSS (Desde CERO en UA-cam) 👉 • 🚀 Curso CSS PARA PRINC...
-----------------------------------------------------------------------------------------------------------------------------
CURSOS COMPLETOS:
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.c...
👨💻🎁 Diseño Web Desde Cero (Descuento) 👉 alexcgdesign.c...
-----------------------------------------------------------------------------------------------------------------------------
✉️ Redes sociales:
Blog de desarrollo web: www.alexcgdesi...
Facebook: goo.gl/7o77tx
Linkedin: goo.gl/byCJnS
Github: github.com/Ale...
![Como CREAR un FORMULARIO con HTML y CSS [RESPONSIVE]](http://i.ytimg.com/vi/JpaSz6XUtaw/mqdefault.jpg)
![Como CREAR un FORMULARIO con HTML y CSS [RESPONSIVE]](/img/tr.png)
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.com/cursocss
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 .
Excelente amigo, justo es lo que estaba buscando
Gracias por ir subiendo este material
Excelente video. Para tener en cuenta las - - transform: / - - transition: 😊😊
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
Espectacular explicación Alex. Muchas gracias.
Muchas Gracias por el contenido. Muy bien explicado.
gracias hermano vi varios y este fue el q mejor me sirvio!
Eso hermano cada ves mas interesante me gusta tu enseñanza sin framework
Muchas gracias, excelente video. Me saco de un apuro
Eres un Crack estimado :)
Increíble video, muchas gracias!
Explicación magistral bro , muchas gracias
Excelente contenido, GRACIAS!!!!
Gracias por este video me ayuda un monton !
eres un grande en esto gracias por impartir enseñanza
Qué gran video, muy bien explicado y detallado de forma que es entendible, sin usar frameworks o nada. Muy buen video amigo
perfecto un Diez hermano gracias :D ya me habia suscrito asi que un like jeje
Excelente video!!!
Muy buen contenido gracias hermano lluvias de bendiciones
Gracias por el contenido, ayuda bastante
Exelente explicación, tengo una pregunta, si quiero utilizar la modal para varios botones, que hay que tener en cuenta?
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
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
En vez de poner opacity 0 y pointer none, no es más fácil display none?
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. 😅
Buen video 😄
Gran video, y para tener mas dd un modal?
Saludos.
IMPECABLE !
excelente
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??
Muy duro
Me salió todo igual, ahora pasa que no quiere mostrar el modal con el click, no me reconoce 🤡
Que libro de CSS recomiendas?
Y el JS para almacenar que el modal esta cerrado con session storage y localStorage, como se haria?
geniooo
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
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
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
y cómo seria para cerrar el modal haciendo click fuera del modal? 🤔
Hola, cómo puedo tener varios nodal con varios botones
Ótimo vídeo parabéns 👍 mais se for múltiplos modals como faço.
Excelente tutorial, pero como hago si tengo mas de un boton para que me ejecute el mismo modal pero con cada uno de los botones diferentes?
Creo que debes crear otros addEventListenner, para cada botón y llamas al modal
gracias@@JacRomeo
Alguien ha intentado hacer que se cierre el modal pulsando fuera del modal (en la parte gris) una vez abierto ?, si me pueden pasar el script
Tendrias que agregar un addEventListener de click al elemento background del modal, y que ejecute la función closeModal!
Es lo que andaba buscando eh creado bastantes pero del modo que las hago no me gusta el resultado