What are the main problems of my wretched slider?

Question

css

There is a simple version of the slider that scrolls in "real time" one pixel every * milliseconds.

var sliderElement = document.getElementsByClassName('header__slider-ul');
var a = 5;

var slider = setInterval(function() {
    a = a-1;
    sliderElement[0].style.marginLeft = a + "px";
    if (a < -665) {
        a = 5;
    }
}, 100);

function sliderMouseOut() {
    slider = setInterval(function() {
        a = a-1;
        sliderElement[0].style.marginLeft = a + "px";
        if (a < -665) {
            a = 5;
        }
    }, 100);
}

function sliderMouseOver() {
    clearInterval(slider)
}

In the html itself there is a block in which there are a bunch of pictures. How can this fear be improved?

Answer 1

First, start using transform.
Then look towards requestAnimationFrame.
And also to understand how transitions work.

Answer 2

Cycling, sir.
Swiper has freemode and in its api you can completely code autoscrolling at the desired speed.
idangero.us/swiper/demos/09-freemode.html
idangero.us/swiper/api