COMO HACER un SLIDER AUTÓMATICO con HTML & CSS en SOLO 4 MINUTOS | De 0 al 100% | NIVEL SUPER EASY!

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

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

  • @elmatagoblins7u763
    @elmatagoblins7u763 Год назад +7

    excelente hermano no sabes de la q me salvaste. quería hacer un slider pero los tutoriales q seguía afectaban mucho a mi barra de menú, el tuyo es el único q me sirvió gracias bro

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

      Que bueno hermano, este no te afecta a nada ya que está en un bloque por separado de los demás

  • @warriors000
    @warriors000 2 года назад +4

    MUCHAS GRACIAS POR LAS CLASES, ESTUBO MUY BUENO. SUERTE :)

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

    Buenas, prestando si veo las imagenes pero tienen una altura infima casi ni se ven... yo tengo el slide del lado derecho puse todo el codigo adentro de otro div que lo ubica a la derecha. (antes tenia una imagen fija y se veia bien en la mitad derecha de la pantalla), Estoy probando cambiar las propiedades de position pero no veo cambios.

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

    Buenas tardes, el infinito lo pude implementar pero este simplemente no me carga las imagenes, caculo que la funcion url no esta encontrandolas, use solo nombre.jpg o ruta completa como hago siempre y nada. No me muestra ni siquiera la imagen de background de la clase slider.

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

    las imagenws deben ser del mismo tamaño ?

  • @Peski_
    @Peski_ 11 месяцев назад +1

    Hola, buen video, de primera me sirvió, pero tengo una duda. ¿Solo sirve con imágenes con esa relación de aspecto? Lo intenté con imágenes rectangulares (casi cuadradas) en vertical, pero no salen completas ¿Alguien sabe que cosas debo sustituir para que salgan las imágenes completas? Soy nuevo en esto y no sé mucho. Gracias

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

      La idea es que sean del mismo tamaño, porque si son diferentes el aspecto que le pongas puede romper el slide, y por eso es mejor, te puedes ahorrar errores y más en modo responsive

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

    Muy bueno, sigo practicando. Gracias.

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

    Implecable! me re sirvio, ahora solo lo tengo que hacer responsive

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

      Que bueno que te haya servido, puedes usar max y min width para responsive sin necesidad de media queries!

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

      @@codeglitch1884 Muchas gracias! lo voy a hacer asi!!

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

    Elegante el código, gracias por tu tutorial.

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

    Excelente video, una duda, ¿Como puedo hacer para que al momento de poner una barra fija se oculte el slider al hacer scroll?
    Gracias!!!

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

      Podrías usar las propiedades de scrollbar para configurarlo como tu gustes, pero no logro entender que necesitas exactamente, ¿Me cuentas más?

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

      @@codeglitch1884 coloque un header que tiene position fixed, al momento de agregar el slider, se ve normal, el problema es cuando quiero ir bajando en la página, el slider se coloca encima del header, no se que propiedad debo cambiar

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

      @@fersolisjaime4330 Vale, ya lo tengo!
      Simple, solo al header agregale en CSS la propiedad z-index: 2; y ya debería arreglarse, y si no ve subiendo a 3, 4...
      Eso debe funcionar.

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

    Hola lo hago igual que el vídeo y no me aparece nada, inspecciono la página y siquiera figura el div, por qué puede ser? ayuda por favor, me encanta como queda el slider así :(

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

    Me salio pero como puedo calcular el tiempo de la animacion con los porcentajes todavía no entiendo

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

      10 segundos para 4 imágenes, y divides el número de imágenes pensando que tus 10 segundos son 100%, eso significa que 4/100 son 25
      Significa 25% = 2.5 segundos

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

    hermano una duda al colocar position:absolute, no me deja seguir desarrollando la pagina web debido a que todos los elementos nuevos que inserto se van detrás de las imágenes y no hacia abajo, como puedo solucionar esto porfavor

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

      Para que no suceda eso, debes meter el slider en un contenedor y la posición absolute debe emparentar a ese contenedor, y el otro contenido mételo en otro contenedor, osea en otro div, o section, o article, ¿me explico?

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

      Me pasa exactamente lo mismo, se sobre ponen al siguiente bloque que tengo y se ve todo mal

  • @JoseMeléndez-v4w
    @JoseMeléndez-v4w Год назад

    disculpa y para hacerlo manual como lo hago?

    • @codeglitch1884
      @codeglitch1884  11 месяцев назад

      Tengo otros videos, puedes buscarlos en el canal

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

    lo hice con 3 imagenes pero el efecto no sale igual las imagenes se estiran hacia abajo

  • @bosque-oscuro
    @bosque-oscuro 2 года назад +1

    🥰 Genial gracias

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

    Cómo se puedede mejora de manera responsive?

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

      El responsive siempre se trabaja con porcentajes de esa forma será más fácil, pronto subiré uno totalmente responsive, de momento intenta usar % rem como medidas relativas

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

    alguien sabe por que no me podría aparecer ?

  • @abi-ezerxavierguerracuadro7537
    @abi-ezerxavierguerracuadro7537 2 года назад

    Nuevo subscriptor

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

    buena men , seguiras subiendo material? dejo like y sub

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

    hola, ¿cual es la aplicacion que usas en el video?

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

    pero no es responsivo?

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

    A mi no me funciona :´)

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

      Que parte no te funciona?

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

      @@codeglitch1884 En el slider automatico, no cambia... pero hice el del video de 9 min y ese si me sirvio. gracias! te agradeceria tambien si pudieras subir el repo de este para ver en que falle y gracias

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

    gracias

  • @geodatacenter
    @geodatacenter Месяц назад

    Compartir code

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

    Pero, ¿ Y el link? :v

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

      Siempre está en la descripción bro

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

    necesito el link pa que me puedan pagar en mi empresa :v

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

    no sirve

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

      Funciona perfectamente, hazlo bien bro, no seas flojo 🙄

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

      @@codeglitch1884 tengo un problema, no me funciona :´) y esta hermoso pero no funciona.

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

      Me funcionó super bien adaptándolo a las medidas de mis imágenes, pero me gustaría saber si puedo hacer otro tipo de animación que no sea fade in, tal vez algo como deslizar

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

      @@codeglitch1884 a mi tampoco me funciona sera que tu ocultas codigos y por eso a unos cuantos aqui no le fiunciona eso.