@DaniilKhanin

Как можно реализовать бесконечно прокручиваемый background на css?

Ссылка на Jsfiddle
Реализовал прокрутку bg, изображение bg сделано так чтобы можно было повторять по x, но не знаю как сделать чтобы не было прирывисто как у меня...
Думал поможет fill-mode, тоесть когда анимация дойдет до left -100% он сохранит значение и уже начнет новую (так как стоит infinite) с позиции -100% но увы...
#bg {
    width: 10500px;
    height: 100%;
    background: url('../img/bg/test.png') repeat-x;
    position: absolute;
    top: 0;
    background-size: 100% 100%;
    -webkit-animation: changewidth linear 5s infinite;
    animation: changewidth linear 5s infinite;
    animation-fill-mode: forwards;
}

@keyframes changewidth {
    from { left: 0}
    to { left: -100%}
}
  • Вопрос задан
  • 226 просмотров
Пригласить эксперта
Ответы на вопрос 1
delphinpro
@delphinpro Куратор тега CSS
frontend developer
Ваш ответ на вопрос

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

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