Good afternoon people, could you help me. I am putting in the site that I am developing a very simple slider to just pass 3 images. the example I get on the w3school site. But as he goes past the images, the moment he arrives at the last he disappears and after a long time he returns. What will happen? Anyone have any suggestions? Follow the code I'm using.
- One problem I identified is that I'm trying to use 4 equal sliders on the same page, because when I took the other 3 sliders it worked, what do I do to use the 4 sliders on the same page?
var myIndex = 0;
carousel();
function carousel() {
var i;
var x = document.getElementsByClassName("myCarousel2");
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
myIndex++;
if (myIndex > x.length) {
myIndex = 1
}
x[myIndex - 1].style.display = "block";
setTimeout(carousel, 2000); // Change image every 2 seconds
}
<div class="w3-content w3-section">
<img class="myCarousel2" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=350%C3%97150&w=350&h=150"><imgclass="myCarousel2" src="./img/efloor/gerencial_slider.png">
<img class="myCarousel2" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=300%C3%97150&w=350&h=150">
</div>
<!--Slider 2-->