Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

184
Vistas
Cómo crear una galería automática que vaya rápido y luego se detenga en una imagen por más tiempo

Así que tengo una galería automática tomada de w3schools enlazada aquí .

Estoy tratando de encontrar una manera de hacer una galería similar, excepto que pasa por un bucle en el que primero se muestran 5 imágenes a .3 s cada una, luego se sienta en una imagen durante 5 segundos. Luego repitiendo este proceso.

He estado tratando de resolverlo, pero no entiendo JavaScript lo suficiente como para saber cómo abordarlo. ¡Cualquier consejo o dirección sería muy apreciado!

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Es posible que desee proporcionar un tiempo de espera para cada imagen o especificar qué orden de la imagen tiene un tiempo de espera diferente. Tomando w3school como ejemplo, puedes hacer esto

  1. Tiempo de espera de suministro para cada imagen
 function showSlides() { var i; var timeout = [2000, 5000, 3000] // timeout for image1, image2, image3 var slides = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("dot"); for (i = 0; i < slides.length; i++) { slides[i].style.display = "none"; } slideIndex++; if (slideIndex > slides.length) {slideIndex = 1} for (i = 0; i < dots.length; i++) { dots[i].className = dots[i].className.replace(" active", ""); } slides[slideIndex-1].style.display = "block"; dots[slideIndex-1].className += " active"; setTimeout(showSlides, timeout[slideIndex-1]); // get timeout based on current image order }
  1. Agregar una condición basada en el pedido
 function showSlides() { var i; var slides = document.getElementsByClassName("mySlides"); var dots = document.getElementsByClassName("dot"); for (i = 0; i < slides.length; i++) { slides[i].style.display = "none"; } slideIndex++; if (slideIndex > slides.length) {slideIndex = 1} for (i = 0; i < dots.length; i++) { dots[i].className = dots[i].className.replace(" active", ""); } slides[slideIndex-1].style.display = "block"; dots[slideIndex-1].className += " active"; //make second image last for 5 seconds if(slideIndex === 2){ setTimeout(showSlides, 5000); // Change image at 5 seconds }else{ setTimeout(showSlides, 2000); // Change image at 2 seconds } }

Tenga en cuenta que tal vez sean una mejor manera de hacerlo, pero quiero mostrarle que solo necesita proporcionar setTimeout con el tiempo adecuado que desee.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda