Image-Carousel/script.js at main · hitarthpathak/Image-Carousel · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
let slides = document.querySelectorAll(".slide");
let counter = 0;

slides.forEach((slide, index) => {
    slide.style.left = `${index * 100}%`;
})

function previous() {
    if (counter > 0) {
        counter--;
        slide_image();
    }
}

function next() {
    if (counter < 4) {
        counter++;
        slide_image();
    }
}

function slide_image() {
    slides.forEach((slide) => {
        slide.style.transform = `translateX(-${counter * 100}%)`;
    })
}


// --------------------------------------------------------------------------------------------------


let main_image = document.getElementById("main-img");

function change_image(path) {

    main_image.setAttribute("src", path);

}