window.onload = function(){
new Slider({
images: ".slider__galary img",
btnPrev: ".btnPrev",
btnNext: ".btnNext",
rate: false
})
}
class Slider{
construnctor(obj){
this.images = document.querySelectorAll(obj.images);
this.btnPrev = obj.btnPrev;
this.btnNext = obj.btnNext;
this.rate = obj.rate;
this.time = obj.time || 1000;
var self = this;
var i = 0;
}
prev(){
self.images[i].classList.remove("showed");
i--;
if(i < 0){
i = self.images.length - 1;
}
self.images[i].classList.add("showed");
}
next(){
self.images[i].classList.remove("showed");
i++;
if(i >= self.images.length){
i = 0;
}
self.images[i].classList.add("showed");
}
document.querySelector(this.btnPrev).onclick = this.prev;
document.querySelector(this.btnNext).onclick = this.next;
if(this.rate){
setInterval(this.next, this.time);
}
}document.querySelector(this.btnPrev).onclick = this.prev;
document.querySelector(this.btnNext).onclick = this.next;if(this.rate){
setInterval(this.next, this.time);
}