[TheSanches]

Возник еще один вопрос, я прикрутил точки к слайдеру, но не могу сделать чтобы они были кликабельны, то-есть чтобы можно было с помощью них тоже прокручивать слайдер, ниже код который уже есть.
Спасибо еще раз.

<div class="slider__dots">
     <span class="slider__dots-item slider__dots-item_active"></span>
     <span class="slider__dots-item"></span>
     <span class="slider__dots-item"></span>
</div>

.slider__dots-item{
  width: 13px;
  height: 13px;
  border: 1px solid black;
  display: inline-block;
  border-radius: 50%;
  margin-right: 5px;
  cursor: pointer;
  transition: all 0.4s;
}

.slider__dots-item.slider__dots-item_active{
  background: black;
  transition: all 0.4s;
}

.slider__dots-item:last-child{
  margin-right: 0;
}

.slider__dots-item:hover{
  background: black;
}

// получаем кнопки
var sliderBtnLeft = document.querySelector('.slider__btn_left');
var sliderBtnRight = document.querySelector('.slider__btn_right');
var sliderContainer = document.querySelector('.slider__container').offsetWidth;
var sliderItems = document.querySelectorAll('.slider__item'); 
var sliderScroll = document.querySelector('.slider__scroll');
var sliderDots = document.querySelectorAll('.slider__dots-item'); //кружочки
var sliderIndex = 0;
var Width = 0;

function sliderMove(up){
  sliderIndex = (sliderIndex + up + sliderItems.length) % sliderItems.length;
  Width = 0;
  for (var i = 0; i < sliderIndex; i++) {
     Width += sliderItems[i].offsetWidth + 65
  }
  sliderScroll.style.transform = 'translateX(-' + Width + 'px)';

  //добавляем кружочки
  for (var j = 0; j < sliderDots.length; j++) {
    sliderDots[j].classList.remove('slider__dots-item_active');
    sliderDots[sliderIndex].classList.add('slider__dots-item_active');
  }
  
}

sliderBtnRight.onclick = sliderMove.bind(null, 1);
sliderBtnLeft.onclick = sliderMove.bind(null, -1);