CREA un DROPDOWN Menú ** SOLO CSS **
HTML-код
- Опубликовано: 17 окт 2024
- 📣 ¿Necesitas un Hosting y Dominio? Utiliza el cupón "ALEXCG" hasta 90% de descuento en Hostinger.com.
ENTRA AQUÍ 👉 www.hostinger....
Crea un menú desplegable únicamente con CSS, sin utilizar JavaScript.
📘CURSO CSS3 COMPLETO (Descuento) 👉 alexcgdesign.c...
Descarga los archivos: alexcgdesign.c...
-----------------------------------------------------------------------------------------------------------------------------
Aprende CSS (Desde CERO en RUclips) 👉 • 🚀 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...
Twitter: / alexcgdesign
Facebook: goo.gl/7o77tx
Linkedin: goo.gl/byCJnS
Instagram: / alexcg_design
Github: github.com/Ale...
📣 ¿Necesitas un Hosting y Dominio? Utiliza el cupón "ALEXCG" hasta 90% de descuento en Hostinger.com.
ENTRA AQUÍ 👉 www.hostinger.com/alexcg
Un duro bro 🔥🔥🔥 Espero aprender mucho en tu curso de CSS, ya lo compre!!!
Fantástico! Aparenta un menu más de tantos, pero si le sigues bien el código ves la mágia. Muchas gracias por la dedicación y ánimo para hacer la opción desktop!
Me gusto mucho, la verdad, todo lo que sea sin JS me parece fascinante. Me encanto la dinamica de usar variables locales para armar un switch, aprovechandose de la dinamica de la cascada.
Lo que no me gusto, y esto tomenlo con pinzas, fue que tiene problemas de accesibilidad (con el focus y la navegacion keyboard especificamente). Ahora bien, desconozco si este problema tambien lo tiene la tecnica con javascript. Igual no es como que no se pueda resolver, pero quizas le agrega ese plus que se intentaba eliminar por no hacerlo de la manera tradicional.
Igualmente asi como esta, esta perfecto. De las explicaciones mas claras que vi y encima usando BEM!
Impresionante. Yo tengo tu curso de CSS en Udemy. Me pareces un master en CSS, y no me lo tomes a mal pero, me cuesta mucho entender cuando explicas. Eso mismo me pasó en el curso de Udemy, y lo dejé pendiente por eso. Mi intención no es ser un comentario negativo, sino expresarte lo que percibo, y si te sirve quizá para mejorar en tus explicaciones pues qué beneficio, porque quizá como yo haya más gente, y explicar de manera más clara te serviría para tener más alcance a más gente. En cualquier caso, gracias por compartir el tutorial y tus conocimientos en general. Buen video!
Me pasa lo mismo, no suelo concentrarme si alguien explica de esa manera, quizas otras personas si, pero necesito que la persona este casi como si fuera hablando conmigo, una charla de amigos para entenderlo, como lo hace Fernando herrera en udemy.
Por esa razón no compro los curso de el, porque la menera de explicar es muy acelerado y difícil de entender o de seguir, pero igual no se le quita que es un máster en CSS
Que temas se te dificulta en css?
Yo en su mayoría aprendi de otra manera pero me gustaría ayudarte almenos con lo que sé.
Hola qué tal, espero ser de ayuda amigo, yo le bajó la velocidad a los cursos de udemy cuando no puedo seguirles el ritmo, yo también compré su curso, está muy bueno en contenido la verdad, saludos.
Yo como ya tengo bastante conocimiento en css3 los vídeos de el se me hacen bastante sencillos, quizás no puedes seguirle porque aún te falta práctica, es opinión personal ya que a mí no se me dificulta su forma de explicar.
Muy buen contenido master, cada vez aprendo mas con tus videos, es magnifico hacer todo este menú solo con CSS, gracias por compartir tus conocimientos, sigue así mi estimado. Me pondré el reto para adaptarlo a desktop. Gran video como los muchos que has subido👏
Eres un pro muchas gracias, me gustaria ver la 2da parte, eso si no se porque, me costo entenderlo son tantos detalles en un instante
Estaría genial llevar este menú, para que fuese móvil y verlo normal en desktop, eres un crack Alex 🏆
Gracias, de entre mucho buscar, este es el menu que implementaré en mi sitio pero aún seguimos esperando la parte 2 para que sea responsive. Te felicito también porque en la actualidad me suena a que ya estas dejando esa forma de explicar como por enunciados que hacía un poco difícil entenderte, como que distraía la concentración.
Gran trabajo. Me ha encantado. Bien explicado y muy útil. Gracias.
¡Me encantó el tutorial! ¡Muchas gracias!:D
Excelente video.
Me parece bien que hagas la versión de ese mismo menú, pero para desktop. Lo busqué y no lo encontré, por lo que supongo no se ha hecho. O no busqué bien.
Felicitaciones y muchas gracias por enseñar
Mi estimado se te agradece el diseño muy bueno para poder implementarlo
Me encanto tu solucion y me sirvio muchisimo, muchas gracias!!
Hola amigo, como puedo hacer un carrito de compras con css? gracias!
Hola como va?, tienes algun video de como crear un dropdown en un menú con solo css, me refiero a que no sea un solo dropdown si no que varios, por ejemplo tienes 3 secciones por ejemplo marketing, desarrollo, proyectos y esas 3 secciones tienen contenido dentro por ejemplo marketing "seo", "branding", desarrollo "wordpress" "html css y js" y en proyectos "galeria de fotos", gracias o si tienes algun ejemplo que hayas hecho y lo hayas subido a js genial
Hola buenas tardes, nose si me podran ayudar, pero estoy intentando hacer un menu desplegable en el que cuando el usuario haga click en los links dentro de el, por ejemplo el INICIO, CONTACTO, AYUDA, etc me lleve a esa seccion de la pagina y paralelamente el menu se cierre automaticamente.
En javascript, tienes q obtener el enlace que hizo el click , y luego obtener su padre y cerrarlo con una clase de css
Esta muy bueno el video, gracias
Buen ejemplo a ver si te animas a hacer el desktop para la comunidad!!!
genial, sabrias como hacerlo con react y tailwind o de alguna otra manera que no sea css puro?
Excelente!! Mil gracias
Muy buen video manito
como puedo hacer para que el menu desplegable al seleccionar una opcion te redirija a la seccion especificada del html y se cierre el menu desplegable? yo tengo un menu hamburguesa para movil.
Usa id
Muy bien una excelente y practica solución 👍🏼
Buenísimo gracias por la información
tremendooo!!
Esta propiedad es compatible con todos los navegadores o aún es experimental?
Aquí te lo explico:
💪 Tutorial Pseudoclase :Has() - ¿No más JavaScript?
ruclips.net/video/9oghptyxHEg/видео.html
@@AlexCGDesign gracias:D
Cuando se agregan mas dropdown__links, y los expandes el contenido inicial se va perdiendo y solo puedes hacer scroll hacia abajo
muchas gracias Alex, ¿como podria hacer un dropdown dentro de otro dropdown?
Para lo que quieres hacer tienes que anidar, copiar/pegar o escribir las listas ul li dentro de la principal.
Hola Master, sería bueno un curso con superpoderes de Bootstrap (:
genial 🗿
Alguien sabe si la pseudoclase :has es compatible con el navegador mozilla firefox?
No, de momento es el único navegador que no la soporta, no se si habrá algún apaño para estos casos pero no podemos dejar a los posibles usuarios de firefox sin nuestro dropmenu, es una lastima.
Usa evento click de javascript, ya q has aún no es soportado en Firefox
verga me acaba de explotar cada neurona que me quedaba viva
me descargue el tuyo y por alguna razon no funciona 😭😭😭q alaguien m explique q polloooo
edit: en firefox el has no funciona 💀💀💀💀
Busca en caniuse
Fuera bueno solo colorear el item activo y evitar que se vaya acumulando los item seleccionados.pero muy buen video.
Se podría hacer con inputs de tipo radio:))
Entendí muy bien, solo que muestras nada mas la funcion para celular
Genial eres increíble @AlexCGDesign
Excelente