Difficulty in javascript with the return button of a rotary image banner

Question

Hey, community, I’m new. I come to ask for help from more experienced people regarding the following problem: I want to make a banner of images on a site where images pass every 4 seconds, but there are two buttons (one on the left and one on the right) which, when pressed, PARAM the setInterval that I created and make it necessary to press the buttons to navigate between images. The problem is that I could not program the return button correctly. It works on the 1st click and then returns an error. I’ll leave the code behind, let you know it’s a half-length code.

let time = 4000,
    currentImageIndex = 0,
    images = document.querySelectorAll("#slider img")
    max = images.length;

function nextImage() {

    images[currentImageIndex].classList.remove("selected")

    currentImageIndex++

    if(currentImageIndex >= max)
        currentImageIndex = 0

    images[currentImageIndex].classList.add("selected")
}

function returnImage(){

    images[currentImageIndex].classList.remove("selected")

    currentImageIndex--

    if(currentImageIndex <= 0)
        currentImageIndex = max

    images[currentImageIndex].classList.add("selected")
}

function button_next(){
    console.log("next")
    nextImage();
    stop();
    
}
function button_return(){
    console.log("return")
    returnImage();
    stop();
    
}

var rollInterval = setInterval(() => {
    nextImage()}, time)

function start() {
    rollInterval
}

function stop() {
    clearInterval(rollInterval)

}

window.addEventListener("load", start)

Helping me with that part is more than enough and I am very grateful, however if anyone can still answer on whether it is possible to give some kind of reset in the setInterval instead of STOP HIM, would be much more interesting for my project. I know this function does not exist natively.