Exibir banner de imediato quando página for carregada

[Biel. 9]

Olá pessoal. O banner está funcionando, mas tem um intervalo de 10 segundos para aparecer quando a página é atualizada.  isso não é bom !  Quero tirar os 10 segundos de espera quando a página é atualizada, mas quero que o banner continue rotacionando de 10 em 10 segnudos

<style>
.divTotoPai {
	width:100%; 
	border: 4px solid red;
}
.divToto {text-align: center;}
.imgToto {width:240px; height:240px; } 
.imgToto:not([active=true]) {display:none; }
</style>

<div class="divTotoPai">

<div class="divToto">
<a href="link1.php" target="_blank"><img src="banner1.png" class="imgToto" /></a>
<a href="link2.php" target="_blank"><img src="banner2.png" class="imgToto" /></a>
<a href="link3.php" target="_blank"><img src="banner3.png" class="imgToto" /></a>
<a href="link4.php" target="_blank"><img src="banner4.png" class="imgToto" /></a>
<a href="link4.php" target="_blank"><img src="banner5.png" class="imgToto" /></a>
</div>

</div>
<script>
  function funcToto(containerId, intervalTime) {
  let elementSlider = document.querySelector(containerId);
  let intervalRef = setInterval(() => setActiveSlide(containerId), intervalTime);
  
  enableSlideMouseEvents(containerId, elementSlider, intervalRef, intervalTime);
}

function setActiveSlide(container) {
  let images = document.querySelectorAll(`${container} img`);
  
  let removeActiveAttribute = () => {
    images.forEach(image => image.removeAttribute("active"));
  };
  
  let toggleSlide = (indexImageToActive) => {
    removeActiveAttribute();
    images[indexImageToActive].setAttribute("active", true);
  }; 

  let indexActive = Math.floor(Math.random() * images.length);
  
  toggleSlide(indexActive);
}

funcToto(".divTotoPai", 10000);
</script>

 

[tetsuo 0]

só colocar active na primeira imagem

[Biel. 9]

57 minutos atrás, tetsuo disse:

só colocar active na primeira imagem

Esse active vai aonde tetsuo ? banner1.png  não pode aparecer sempre que a página é atualizada, senão ele estará em vantagem em relação os outros banners. A coisa tem que ser tipo sorteio nunca se sabe qual banner vai aparecer quando a página for atualizada

[tetsuo 0]

sorteie um para receber active

 

[Biel. 9]

4 horas atrás, tetsuo disse:

sorteie um para receber active

 

Colocar active em um banner específico, para o que quero fazer, não fica bom.

Veja: Assim que a página é atualizada o banner apareçe somente depois de 10 segundos de espera . Quero tirar esses 10 segundos de espera quando a página é atualizada, mas quero que o banner continue rotacionando de 10 em 10 segnudos

[Omar~ 87]

Experimente esse meu script para usar como banner é responsivo e com suporte a touch-screen.

Toda explicação, formas de uso e exemplo funcional se encontra no arquivo html.

https://github.com/Spell-Master/sm-web/tree/master/javascript/SlideCarousel