Как сделать остановку слайд-шоу при наведении мыши - PullRequest
Новая
       34

Как сделать остановку слайд-шоу при наведении мыши

1 голос
/ 21 апреля 2020

Вот код, который у меня есть в js. Я пытался сделать кое-что, что я видел на inte rnet, но это привело к тому, что слайд-шоу не работало вообще. 

<script>
var slideIndex = 0;
showSlides();

function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
for (i = 0; i < slides.length; i++) {
  slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex > slides.length) {slideIndex = 1}
slides[slideIndex-1].style.display = "block";
setTimeout(showSlides, 5000); // Change image every 5 seconds
}


</script>

1 Ответ

1 голос
/ 21 апреля 2020

Вы можете использовать clearTimeout(id), чтобы остановить тайм-аут при наведении курсора мыши. Затем снова начните тайм-аут при отпускании мыши. Вы можете получить идентификатор с помощью let id = setTimeout(...)

. Вы можете использовать прослушиватели событий для проверки, находится ли мышь на слайдах 

let id = setTimeout(...)

slides.addEventListener("mouseover”, function (e) {
    clearTimeout(id)
})

slides.addEventListener("mouseout”, function (e) {
    id = setTimeout(...)
})
...