Photo slider forward and backward, what's wrong?

Question

Slider

There is code (js) and forward and backward buttons that respectively perform the ...L and ...R functions.
When you click on the button with the viewImagesR() function, the images change normally in turn (i.e. from 0 to 6 and in a circle), but when you click on the button with the viewImagesL() function, the image changes first to the next one (i.e. if it was 1, then it becomes 2) and when you press it again (and further), it starts switching to the previous one, as it should be.

What is the error in the code? What is needed for the code to work as intended?

var images = new Array();
var i = 0;

images[0] = './img/kot1.jpg';
images[1] = './img/kot2.jpg';
images[2] = './img/kot3.jpg';
images[3] = './img/kot4.jpg';
images[4] = './img/kot5.jpg';
images[5] = './img/kot6.jpg';
images[6] = './img/kot7.jpg';


function viewImagesR() {
document.getElementById("img_cats").src = images[i];
i++;
if (i == images.length) {
i = 0;
}
}

function viewImagesL() {
document.getElementById("img_cats").src = images[i];
i--;
if (i == "-1") {
i = 6;
}
}

Answer 1

In this piece, everything seems to be correct. Perhaps the viewImagesR function is fired first?
In general, nobody canceled console.log. To find a bug, you need to localize it. Perhaps i is defined correctly for you, and the error is further down the code.