Как сделать эту анимацию CSS «задом наперед»CSS

Разбираемся в CSS
Anonymous
Как сделать эту анимацию CSS «задом наперед»

Сообщение Anonymous »

У меня есть код для автоматического чистого слайдера HTML и CSS, но я изо всех сил пытаюсь сделать его в противоположном направлении, изначально он идет слева, но я пытаюсь заставить его перейти слева направо. моя «версия» https://codepen.io/sappho7124/pen/rwewqpdобразно appen. ustify-content: flex-end; И направление анимации, но, кажется, ничего не работает. /> html < /p>



Изображение

Изображение

Изображение

Изображение

Изображение

Изображение

Изображение

Изображение

Изображение

Изображение

Изображение

Изображение

Изображение



< /code>
scss < /p>
body {
align-items: center;
justify-content: center;
}

$animationSpeed: 40s;

@keyframes scroll {
0% { transform: translateX(0); }
100% { transform: translateX(calc(-250px * 7))}
}

.slider {
height: 100px;
margin: auto;
overflow:hidden;
position: relative;
width: auto;

.slide-track {
animation: scroll $animationSpeed linear infinite;
display: flex;
width: calc(250px * 14);
}
.slide {
height: 100px;
width: 250px;
}
}


Подробнее здесь: https://stackoverflow.com/questions/759 ... -backwards

Вернуться в «CSS»