Cheizer
@Cheizer

Почему в css3 анимации при маленькой скорости проигрывания в 90s рисунок движется рывками?

Друзья хочу сделать движение фона в одну, потом в другую сторону, решил сделать на css3 анимации. Но как оказалось при низкой скорости проигрывания в 90s рисунок двигается рывками. Как этого избежать если возможно? Как добиться плавности анимации?

.mountains{
    animation: bg-movement 95s ease infinite;
}

@keyframes bg-movement {
    0%,
    100% {
        background-position: 0 0%
    }
    50% {
        background-position: 100% 0%
    }
}


Во сделал, посмотрите, но у меня широкий экран, на маленьком скорость выше и рывки не видно https://codepen.io/Cheizer/pen/Wypzrg/

Как можно сделать плавное и медленное движение фона? Памагитииииии!!
  • Вопрос задан
  • 473 просмотра
Решения вопроса 1
Как вариант, попробуйте ваш .mountains вложить во .wrapper и анимировать его transform: translateX
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
streetflush
@streetflush
скорее всего потому, что он делает степы в 1%
поставьте значение в px или vw
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы