Ventana Modal Responsive con Html y Css

Поделиться
HTML-код
  • Опубликовано: 6 янв 2025

Комментарии • 31

  • @SLeeDw
    @SLeeDw  3 года назад +5

    Suscríbete ✅ para más vídeos tutoriales de proyectos web 💻
    :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
    ♦ Síguenos en Facebook! 👇:
    bit.ly/sleedw-facebook
    :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
    ♦ Únete a nuestro grupo de WhatsApp 👇:
    bit.ly/sleedw-grupo-whatsapp
    ▶ Saludos y que Dios te bendiga. 🙌

  • @solviana4754
    @solviana4754 Год назад +11

    lo use para mi pagina y me encanto!! la unica diferencia es que lo use para poner un form en el medio jasj pero me ayudo mucho

  • @valkingelf
    @valkingelf Год назад +3

    La opción de poder cerrar la imagen al hacer click fuera de ella me tenía loco hasta que vi tu vídeo, muchas gracias!

  • @angelatatianagarzonmartine7543
    @angelatatianagarzonmartine7543 Год назад +2

    Vi tantos videos y ninguno como este!
    Eres un crack muchas graciaaas por tu contenido!:)

  • @humbertoleal7683
    @humbertoleal7683 6 месяцев назад +1

    Excelente video, gracias por compartir tus conocimientos. Saludos desde Bogota - Colombia

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

      Muchas gracias. Saludos.

  • @nicoelpendejo2557
    @nicoelpendejo2557 9 месяцев назад +1

    me salvaste la vida, muy bien explicado, muchas gracias

  • @maycol_sr
    @maycol_sr Год назад

    He visto varios tutoriales acerca de este tema, pero este es el mejor sin duda. Gracias por ayudarme a concluir mi trabajo.

  • @josecalcagni8472
    @josecalcagni8472 Год назад +1

    👉👉👉 Excelente tutorial, felicitaciones. Muy claro y bien explicado. 😃👌👍

  • @pablomesa9393
    @pablomesa9393 Год назад +1

    excelente!! lo necesitaba en mi proyecto!!! gracias por compartir

  • @jhojanramirez2270
    @jhojanramirez2270 Год назад

    Excelente video, muchísimas gracias 🫡

  • @tercermundistalatino1624
    @tercermundistalatino1624 Год назад +1

    Wow el mejor video del modal y el más corto

  • @fernandocolina2377
    @fernandocolina2377 Год назад +1

    Graciass papu, me sirvio para un proyecto para el colegio🥵

  • @anthonyjoel
    @anthonyjoel 2 года назад +1

    me sirvió pa mi pag de mi proyecto gracias

  • @elen2ne1
    @elen2ne1 2 года назад

    grax,, creo el audio esta adelantado al video, quitabdo eso, me sirvio mucho tu video, mil grax

  • @raulsotelo3195
    @raulsotelo3195 2 года назад

    muchas gracias... muy claro

    • @SLeeDw
      @SLeeDw  2 года назад

      Hola, muchas gracias por tu comentario. Saludos y Bendiciones🙌💻

  • @lali0050
    @lali0050 2 года назад

    GRACIAS !!!!

  • @tenckdraz
    @tenckdraz 2 года назад

    Buenasss yo estoy tratando de hacer una pagina web responsive y no sabia de ese meta, ahora voy a probarlo, unicamente escribi esto:
    /**MOVIL**/
    @media (max-width:839px){
    .desktop{ display: none;}
    }
    /**COMPU**/
    @media (min-width:991px){
    .movil{ display: none;}
    }
    Nose si es correcto vi eso primero y lo utilice.

  • @medicenpeludo4751
    @medicenpeludo4751 2 года назад +2

    es interesante el enlace que hace el checkbox con el contenido del div, cuando esta chequeado es flex y cuando no es none, o me equivoco? digo que es interesante porque me puso a pensar como funciona(si encuentro un fallo en mi lógica modificoo xd)

  • @86rodma
    @86rodma 7 месяцев назад

    hola, como puedo levantar el popup sin la accion del botton, tengo un botton en una pagina que llama una accion en php, esta realiza ciertos procesos si las condiciones se cumplen deseo levantar un popup intente colocar el modal container con un echo ' modal...' pero no lo levanta, gracias

  • @perroconsombrero
    @perroconsombrero Год назад

    4:30 estilos del boton

  • @dantemercurial1957
    @dantemercurial1957 2 года назад +2

    Como puedo hacer que el modal aparezca y desaparezca con una transición suave, buen video!

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

    puedo hacer algo como aplicar un formularío en esa ventana?

  • @Morphing.Lantern
    @Morphing.Lantern 2 года назад

    Respóndeme porfa, como hago para poder tener varios botones de esos pero con textos diferentes

  • @Morphing.Lantern
    @Morphing.Lantern 2 года назад

    Muy bonita tu ventana pero tengo un problema, cuando quiero añadir más de una ventana modal en mi web salen todas con el mismo texto de la primera

    • @maxbournee
      @maxbournee 2 года назад +1

      Tienes que crear otro css para un segundo botón y cambiarle el nombre a las clases, por ejemplo agregarles el numero 2 o 3, etc., para que sepas cual le pertenece a cada uno de tus ventanas modales, quedaría así:
      estilos2.css
      /*:::Ventana Modal2:::*/
      #btn-modal2{
      display: none;
      }
      .container-modal2{
      width: 100%;
      height: 100vh;
      position: fixed;
      top: 0; left: 0;
      background-color: rgba(144, 148, 150, 0.8);
      display: none;
      justify-content: center;
      align-items: center;
      z-index: 100;
      }
      #btn-modal2:checked~ .container-modal2{
      display: flex;
      }
      /*:::Fin Ventana Modal2:::*/
      Y el html quedaria asi:

      Abrir Modal 2


      Aquí iría el contenido que quieras agregarle a tu ventana modal

      Cerrar



      Espero te sirva, saludos

    • @felipevallejos7541
      @felipevallejos7541 Год назад

      @@maxbournee tengo la misma duda, pero en mi caso, tengo los elementos sacados de una base de datos, entonces, mi codigo mete todo a un while y va iterando sobre los datos de la tabla, en ese caso no podría poner un estilo css para cada boton, alguna idea?:(

  • @luisroca6229
    @luisroca6229 2 года назад

    en serio mediafire? o sea git-hub no esta mejor?

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

    Verso