Доброго времени суток, необходимо запустить по клику на кнопку перелистывание слайдов. Но функция начинает работу сразу без клика

Question

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Banners</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@700&display=swap" 
 rel="stylesheet">
<link rel="stylesheet" href="./style.css">
</head>

<body>
<div class="container">
    <div class="slider">
        <div class="slider-line">
            <img src="./img/1.jpg" alt="image of game" class="image-to-show slider-images" />
            <img src="./img/2.jpg" alt="image of game" class="image-to-show slider-images" />
            <img src="./img/3.JPG" alt="image of game" class="image-to-show slider-images" />
            <img src="./img/4.png" alt="image of game" class="image-to-show slider-images" />
        </div>
    </div>
    <button class="button-start"><strong>Start</strong></button>
</div>
<script src="./script.js"></script>

 const sliderLine = document.querySelector('.slider-line');
 const slider = document.querySelector('.slider');
 const sliderImages = document.querySelectorAll('.slider-images');
 const btnStart = document.querySelector('.button-start');

 let counter = 0;
 let sliderWidth = slider.offsetWidth;

 btnStart.addEventListener('click', nextSlide);

 function nextSlide () {
 counter++;

if (counter >= sliderImages.length) {
    counter = 0;
}

slideOver();
}

function slideOver () {
sliderLine.style.transform = `translateX(${-counter * sliderWidth}px)`;
}

setInterval(() => {
nextSlide();
}, 3000);

Answer 1

Нужно удалить конструкцию

setInterval(() => {
    nextSlide();
}, 3000);

а вконце функции nextSlide написать

setTimeout(() => {
    nextSlide();
}, 3000);

если необходимо

БЛОГ НА HUSL

Доброго времени суток, необходимо запустить по клику на кнопку перелистывание слайдов. Но функция начинает работу сразу без клика

Ответы (1 шт):