Тёмный

Crea una Galería con Efecto Lightbox Fácilmente con Materialize CSS 

FalconMasters
Подписаться 512 тыс.
Просмотров 44 тыс.
50% 1

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

 

30 окт 2024

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 108   
@FalconMasters
@FalconMasters 5 лет назад
Con este video llegamos a las 12 semanas publicando video consecutivamente! Si te gusta este tipo de videos y aprecias el esfuerzo en cada video por favor dale manita arriba 👍, eso me motiva mucho a seguir haciendo mas videos!
@1337Unlucky
@1337Unlucky 5 лет назад
Te di dislike para poder dar like de nuevo.
@Hablales_alin
@Hablales_alin 5 лет назад
help me please
@olivaaev4108
@olivaaev4108 5 лет назад
Hola soy nuevo suscriptor tengo un pequeño problema en un sitio web con el sistema HTML, en la página Forumcomunity cuándo hago un tema nuevo y uso etiquetas HTML no las reconoce, a qué refiero ejemplo pongo la etiqueta al principio y otro al final y no lo reconoce cómo una etiqueta sí no que sí aparece y no funciona y eso causa qué no pueda usar el y no se la verdad lo que pasa porque primero uso una app de HTML (SoloLearn) que ahí me reconoce todas las etiquetas y luego cuando lo pasó a está web (Forumcomunity) no lo reconoce, yo lo qué hago es copiar el código completo y luego lo pego y no funciona, en que me equivoco?
@1337Unlucky
@1337Unlucky 5 лет назад
@@olivaaev4108 99% seguro que la comunidad no detecta HTML y es muy probable que detecte un estilo que se llama Markdown. Markdown solo es un estilo para darle formato al texto y no se vea como texto plano, le da al texto negritas, color, cursivas, insertar imagen, etc. Investiga cómo se escribe e inténtalo en esa comunidad.
@federicorodolfothomasyanz
@federicorodolfothomasyanz 8 месяцев назад
Claro, gracias
@danielspark128
@danielspark128 3 года назад
Muchas gracias, he comprado tu curso de desarrollo web 100 % recomendable.💖💖💖💖
@Cibergroup
@Cibergroup 4 года назад
Falcon grandiosa galería de lo mejor al final dices que si nos gusto pero a mi parecer no hay palabras para describir este arte tan maravillosa y esa manera en que ejecutas cada etiqueta y diseño.
@jesusfasabifreyre2459
@jesusfasabifreyre2459 5 лет назад
Gracias Falcon eres un maestro, gracias a ti he aprendido muchas cosas (:
@FalconMasters
@FalconMasters 5 лет назад
Muchas gracias, que gusto escuchar que hayas aprendido mucho!
@luisbazaldua6615
@luisbazaldua6615 4 года назад
Termine la practica! Le voy a estar dando mi estilo cambiándole algunas cosas
@federicorodolfothomasyanz
@federicorodolfothomasyanz 8 месяцев назад
Muchas gracias por ayudar aprender, gracias por el codigo
@eddyyovanivizcarrapulido3498
@eddyyovanivizcarrapulido3498 4 года назад
Gracias Falcon gracias a tu canal de youtube y en los cursos de udemy que tienes lo cual los tengo todos me e ayudado mucho en mi carrera decho ya casi voy por el de php y me muero de ganas de llegar en la seccion de como haces un blog desde cero cuenta con todos mis likes en tu canal siempre pulgar arriba
@jhondcali
@jhondcali 3 года назад
GRACIAS FALCON, ME AYUDASTE
@proodbykenny
@proodbykenny 5 лет назад
FalconMasters gracias por la ayuda que nos ha brindado siempre que haces un video yo hago el mismo ejercicio
@Aliss_nice
@Aliss_nice 5 лет назад
ME SALVASTEE PRO. Gracias por todo lo que hacés eres u genio :))
@alfredolizcano5770
@alfredolizcano5770 5 лет назад
Muy buen vídeo Carlos Arturo, eres una gran inspiración para el desarrollo web te felicito, cuenta con mi apoyo Saludos desde Tabasco
@FalconMasters
@FalconMasters 5 лет назад
Muchas gracias Alfredo!
@ezequielresipa9398
@ezequielresipa9398 3 года назад
Excelente video, muchas gracias!
@Deus-lo-Vuilt
@Deus-lo-Vuilt 2 года назад
wow que genial , muchas gracias justo lo que buscaba
@gabrielvillarreal4964
@gabrielvillarreal4964 5 лет назад
Excelente video!! Muy detallado y bien explicado todo. Saludos FalconMaster🙋🏼‍♂️
@FalconMasters
@FalconMasters 5 лет назад
Gracias!
@jhoanmanuelcarvajal9822
@jhoanmanuelcarvajal9822 9 месяцев назад
gracias por el video
@antoniorandisi3009
@antoniorandisi3009 5 лет назад
Saludos. FalconMasters, gracias por la respuesta rapida. exito...
@vjpadron07
@vjpadron07 4 года назад
Excelente vídeo me gustó muchísimo felicitaciones.
@1337Unlucky
@1337Unlucky 5 лет назад
Excelente video, Carlos!
@FalconMasters
@FalconMasters 5 лет назад
Gracias
@lauraluchetti7321
@lauraluchetti7321 5 лет назад
Gracias Genio! muy útil como siempre y explicado perfectamente para que todos puedamos aprender. Muchas Gracias. Recorda cuando puedas, enseñarnos cómo hacer que aparezca una ventana que permita guardar una web en el escritorio del celular!
@FalconMasters
@FalconMasters 5 лет назад
He estado investigando Laura, pero nunca he hecho eso que quieres, no sabia muy bien como se hace.
@lauraluchetti7321
@lauraluchetti7321 5 лет назад
@@FalconMasters Muchas Gracias de todas Formas. Al navegar desde el Celular, muchas veces aparece una ventana que te permite AÑADIR A INICIO un acceso directo a la Web, pero tampoco sabemos como hacerlo. De todas formas, mil gracias por ocuparte!
@FalconMasters
@FalconMasters 5 лет назад
@@lauraluchetti7321 Ten por seguro que subire un tutorial si aprendo mas del tema.
@salvadorjuarez8641
@salvadorjuarez8641 2 года назад
@@lauraluchetti7321 pero se llama aplicación hibrida
@pcsistemas7086
@pcsistemas7086 2 года назад
Muy buen aporte, tengo una pregunta, ¿se puedo combinar o utilizar dos Framework a la ves en un proyecto (página web)?; es decir bootstrap y materialize.
@chimboterex
@chimboterex 5 лет назад
Gracias por aprender, se podría colocar un botón y texbox para buscar una imagen , de un producto o artículo, gracias , bendiciones
@FalconMasters
@FalconMasters 5 лет назад
Eso ya es algo un poco mas avanzado a esta practica, pero también lo enseño, aquí tienes un tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-42T31laI9Qs.html
@julianrecarte368
@julianrecarte368 4 года назад
Muchas gracias Carlos, tengo una duda, sale todo perfecto a excepción de que cuando le doy la clase "responsive-img" la imagen si se achica pero sigue grande y ocupando toda la pantalla. Verifiqué el codigo anterior y está bien
@sergiocamargo7483
@sergiocamargo7483 3 года назад
Funciona muy bien, pero si ya tengo avanzado el proyecto afecta etiquetas como el nav, se puede hacer algo para que no las afecte?
@unalexmas
@unalexmas 6 месяцев назад
Exacto!!!! Lo solucionaste?
@aborges8851
@aborges8851 9 месяцев назад
Saludos, quiero usar este efecto para una galeria pero de videos, se puede =???
@nelsontrujillo960
@nelsontrujillo960 4 года назад
muy buenooooooooooooooooooooooooooooooooooooooooooooo
@Jesus-mq8vi
@Jesus-mq8vi 3 года назад
Muy buen video como siempre, y muy buen recurso para crear proyectos Saludos ✌
@santiagobv2451
@santiagobv2451 5 лет назад
falcon que tema usas en el visual?
@graalegre195
@graalegre195 3 года назад
Hola, necesito que la imagen de la miniatura sea una, pero la imagen que abre sea otra ya que necesito que se vea la imagen completa, ya que las fotos no son todas iguales. Como debo agregarle eso? Gracias, espero tu respuesta
@angelmani2724
@angelmani2724 4 года назад
sino quiero usar el material si uso brackets funcionara ?
@tintazuldisenografico6519
@tintazuldisenografico6519 4 года назад
gracias por el video, una pregunta:¿Cómo puedo adaptar el materializa para un carrusel de imagenes? ya hice uno de un video tuyo anterior, pero me gustaría que al dar clic se agrandara la imagen y tuviera una descripcion, como aparece aqui. espero tu consejo, muchas gracias.
@jaimeviloriogreen
@jaimeviloriogreen 5 лет назад
Nuevamente genial!!!!!
@unalexmas
@unalexmas 6 месяцев назад
Funciono bien, pero desarmo todo mi Header y su barra de menú principal, pero no veo ninguna relación, o ese script altera cualquier imagen con enlace?
@RobertoMejiaCollazos
@RobertoMejiaCollazos 4 года назад
Tengo una duda si en la clase ""col s12 m4 l3"" es para dar un tamaño responsive, primero de 4 luego de 3 y luego de 1, como puedo hacer para que el contenedor tenga 4 medidas de columnas de 4,3,2, y de 1 osea agregarle un tamaño mas de medida que seria de 2 columnas para tablet porque de 3 columnas para tablet no se ve muy bien. Espero me puedan ayudar. Saludos.
@colommbiano
@colommbiano 2 года назад
maestro como se puede hacer este mismo efecto pero en React y sin Materialize, seria muy complejo hacerlo sin Materialize ??
@denncriss3082
@denncriss3082 5 лет назад
Genial como siempre... Una pregunta falcon que opinas de tailwindCSS y si podrias hacer algún tutorial
@FalconMasters
@FalconMasters 5 лет назад
Tailwind es genial, si tengo ganas de hacer algún tutorial de el, pero no he preparado nada.
@kevinguzman1929
@kevinguzman1929 5 лет назад
Excelente video, ya le di like, pues me pareció muy bien!.
@FalconMasters
@FalconMasters 5 лет назад
Muchas gracias!
@M3NCarmona
@M3NCarmona 5 лет назад
Qué bueno!
@aborges8851
@aborges8851 5 лет назад
claro que valoro el que hagas los videos, lo chimbo es cuando uno te pregunta algo y no contestas...!!!
@FalconMasters
@FalconMasters 5 лет назад
Una disculpa Diego, intento responder todo lo que me ponen, pero a veces es muy difícil, tengo cerca de 400 videos en youtube, 5 cursos en udemy y redes sociales. En todos estos medios me hacen preguntas diarias y a veces no me doy abasto.
@aborges8851
@aborges8851 5 лет назад
@@FalconMasters OK perdnado sr Carlos...!!! siga ilustrandonos, uchas gracias...!!!
@luzcisneros4954
@luzcisneros4954 3 года назад
Cómo lo edito si necesito que aparezca en la parte inferior de la página y no en otra pestaña?
@katyagomezalaniz670
@katyagomezalaniz670 3 года назад
Hola, cómo le puedo hacer si la página será para otra persona. Es decir, que la persona pueda subir fotos sin necesidad de meterse a escribir código? Que pueda, no sé, seleccionar la imagen y subirla simplemente.
@elsusurrooscuro
@elsusurrooscuro 5 лет назад
Excelente 💪💪💪
@ToshinoriYagi98
@ToshinoriYagi98 4 года назад
Uff men de bolas muchas gracias
@TIburonBlanco99
@TIburonBlanco99 Год назад
esta muy chereve me gustaria que al abrir la imagen se le pueda en una flecha y pase a la siguiente imagen sin cerrarla. muchas gracias por compartir tus conocimientos.
@eduardorojas9
@eduardorojas9 5 лет назад
Hola maestro falcon master
@FalconMasters
@FalconMasters 5 лет назад
Hola
@gabrielguardo5677
@gabrielguardo5677 4 года назад
por que al poner esta linea de codigo se me desordena casi todo
@eliasfernandez1624
@eliasfernandez1624 3 года назад
Cómo saco el scroll después de tocar la imágen???
@Cibergroup
@Cibergroup 4 года назад
Chic@s tengo una duda es que ya he ido avanzando en el codigo descargue el ejemplo de falcon y no me aparece nada en mozilla y no se que podria ser agradeceria que me expliquen si he hecho algo mal.
@lucioquiroga7782
@lucioquiroga7782 3 года назад
No se porque pero el link reel que pones, me cambia totalmente el nav. no se como hacer
@Enzo-dp5xo
@Enzo-dp5xo 3 года назад
las fotos tienen que ser del mismo tamaño ? porque me quedan de distintos tamaños y desordenado.
@anell0784
@anell0784 5 лет назад
Saludos. Tengo una página que hace ese mismo efecto de lightbox y presenta las imagenes casi tal cual se ven en este video cuando lo ponen para dispositivos más pequeños seleccionando una de las imagenes y se ve un tanto oscuro el fondo, pero me gustaría lograr en la versión movil poder hacer zoom expandiendo con los dedos. Esta página es un template de worpress que compree y luego fue adaptando a mi gusto. Me gustaría saber como puedo hacer usando css lo de hacer zoom expandiendo con los dedos la imagen.
@luismiguelcruz2343
@luismiguelcruz2343 5 лет назад
Buen vídeo. Podrías explicar un poco como se puede implementar con Bootstrap 4?
@FalconMasters
@FalconMasters 5 лет назад
Este efecto lo estamos haciendo con materialize css que también es un framework como bootstrap, no te recomendaría juntar materialize y bootstrap al mismo tiempo.
@cynthiaxrm
@cynthiaxrm 3 года назад
Hola tenía un menú y cuando hice la galería le cambió la altura tiene algo que ver con JS?
@unalexmas
@unalexmas 6 месяцев назад
es mas el CSS externo, eso lo arruina, una pena, no veo solucion, aun cuando cambie los nombres de las clases a lo contenido en el header. Me avisas como los solucionaste por favor, gracias.
@portillomelgar4238
@portillomelgar4238 3 года назад
Hola man una consulta puedes hacer un video tutorial de como hacer un video galeria sencilla para paginas web como ejemplo una escuelita o instituto que guarden videos cortos de graduaciones de antemano gracias
@freddypercia
@freddypercia 5 лет назад
Que paso con el link de GITHUB,
@FalconMasters
@FalconMasters 5 лет назад
Aquí esta: github.com/falconmasters/lightbox-materialize/
@pablodemartini6318
@pablodemartini6318 2 года назад
Hola, una consulta. Materialize esta pisando uno de los estilos de mi css cambiando el color del nav bar del footer. Como puedo evitrlo?
@FalconMasters
@FalconMasters 2 года назад
Hola Pablo, prueba cambiar el orden en el que enlazas tus archivos CSS. Asegurate de que el archivo CSS de tus estilos personales este debajo del de materialize.
@pablodemartini6318
@pablodemartini6318 2 года назад
@@FalconMasters Hola, gracias por la respuesta, pero están en el orden correcto, pero me sigue dando un color rosa a mi navbar del footer cuando debería ser gris, además de que me cambia otros estilos. Es lo único que me esta pisando de mi CSS
@FalconMasters
@FalconMasters 2 года назад
@@pablodemartini6318 Otra forma de arreglarlo es que seas mas especifico en tus reglas CSS. Por ejemplo en vez de que en tus estilos CSS pongas: .navbar {background: #000;} Se mas especifico y pon la ruta completa, por poner un ejemplo: header .contenedor .navbar {background: #000}
@pablodemartini6318
@pablodemartini6318 2 года назад
@@FalconMasters Hola lo logré solucionar cambiando la etiqueta del footer. Porque no me estaba afectanco la clase, sino la etiqueta. Muchas gracias por las respuestas.
@FalconMasters
@FalconMasters 2 года назад
@@pablodemartini6318 Me alegra que pudieras solucionarlo. Saludos.
@fershowfershow3164
@fershowfershow3164 4 года назад
estoy haciendo un sidebar menu y le agregue lo que hiciste el problema es que el sidebar no cabe en la parte izquierda del lightbox 24:47
@mayma721
@mayma721 3 года назад
Y si quiero el nombre de la imagen abajo de cada imagen y con un tamaño de letra grande y tipo de letra que sea elegante
@alancamarillo9325
@alancamarillo9325 2 года назад
tome su like biejo* sabroz0
@AlexSilvera1
@AlexSilvera1 5 лет назад
Se puede hacer ese mismo efecto con bootstrap4??
@FalconMasters
@FalconMasters 5 лет назад
Se puede aunque es un poco diferente.
@guadalupeelizabethlopezpen9660
@guadalupeelizabethlopezpen9660 4 года назад
Como hago para que todas las imágenes sean del mismo tamaño? :(
@jrasecbenitez9518
@jrasecbenitez9518 Год назад
Lo puedes hacer con paint
@antoniorandisi3009
@antoniorandisi3009 5 лет назад
Saludos, Excelente explicacion, trate bajar del repositorio, pero no se encuentra
@FalconMasters
@FalconMasters 5 лет назад
Aquí esta: github.com/falconmasters/lightbox-materialize/
@jesicamorel6725
@jesicamorel6725 3 года назад
Estoy haciendo lo mismo que el video y no me queda, hago clic en la img y no pasa nada : (
@axelUrielR
@axelUrielR 5 лет назад
Falcon Diosters
@khabron
@khabron 3 года назад
Se puede hacer este efecto pero que sean videos
@camachomoralesluisantonio4209
@camachomoralesluisantonio4209 5 лет назад
cuando quiero descargar tu proyecto me aparece en blanco sera porque no lo tengo actualizado el html (Sublime Text)?
@FalconMasters
@FalconMasters 5 лет назад
Revisa que estes descargando de la rama master y no de la de codigo_base en github.
@camachomoralesluisantonio4209
@camachomoralesluisantonio4209 5 лет назад
@@FalconMasters en la descarga hace la direccion de tu proyecto como: github.com/falconmasters/carousel-materialize.git
@FalconMasters
@FalconMasters 5 лет назад
@@camachomoralesluisantonio4209 Es que esa es la rama de proyecto_base, no la de master. La de master la encontrabas dando en el boton que dice branch: github.com/falconmasters/carousel-materialize/tree/master
@yacolca2007
@yacolca2007 2 года назад
Como hacer que se vaya a otra pagina, redirigirse cuando la imagen se agranda
@lukafialhox3423
@lukafialhox3423 Год назад
ponle un href="link de la página a la que quieras que se redirija" dentro de la etiqueta de la imágen.
@diegovaler9860
@diegovaler9860 3 года назад
11:23
@HUGOSILVA-ee1vo
@HUGOSILVA-ee1vo 5 лет назад
Y habra con flechita a la siguiente foto?
@FalconMasters
@FalconMasters 5 лет назад
En este caso materialize no tiene esa opción.
@HUGOSILVA-ee1vo
@HUGOSILVA-ee1vo 5 лет назад
Y se pidrias hacer una galeria de imagenes con flechita?
@javirulibriz1734
@javirulibriz1734 Год назад
Display Grid.
@thanoscom
@thanoscom 5 лет назад
Señor Falcon, creo que usted es diabólico
@FalconMasters
@FalconMasters 5 лет назад
😈
Далее
Formas Personalizadas y Animadas con Clip Path CSS
28:34
Ледник 1:0 Мужик
00:53
Просмотров 2,4 млн