Скольжение логотипа клиента справа налево, бесконечный цикл ⇐ Jquery

[Anonymous]

Я использую приведенный ниже код для логотипа моего клиента. Этот код создает бесконечный слайдер, который перемещается справа налево.
Я также использую jQuery для добавления дубликатов слайдов для бесконечного цикла.
Однако , я столкнулся с проблемой: код автоматически сбрасывается после того, как слайд достигает четвертой карточки.
Не могли бы вы помочь мне, в чем здесь проблема?

Код: Выделить всё

 $(document).ready(function() {
// Clone cards to create infinite loop
$(".marqueme").clone().appendTo(".marquestarthere");

});

Код: Выделить всё

 .testimonial-cards {
list-style: none;
display: flex;
gap: 56px 31px;
margin: 0 auto;
width: max-content;
flex-wrap: nowrap;
}

.testimonial-cards li {
width: 100%;
max-width: 500px;
min-height: 200px;
}

.marqueslide .marqueme {
flex: 0 0 auto;
margin-right: 20px;
border:1px solid #000
}

/* solution */

.marquestarthere {
animation: marquee 8s linear infinite; /* Set the animation here */
}

.marquestarthere:hover{
animation-play-state: paused;
}

@keyframes marquee {
0%,100% {
transform: translateX(0);
}
99.999% {
transform: translateX(-50%);
}
}

Код: Выделить всё

[list]

[*]Card 1
[*]Card 2
[*]Card 3
[*]Card 4
[*]Card 5
[*]Card 6
[*]Card 7
[*]Card 8
[*]Card 9
[*]Card 10


[/list]

Подробнее здесь: https://stackoverflow.com/questions/783 ... inite-loop