CSS / HTML-Фоновое изображение

Question

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

Answer 1

В .html шаблон:

<div class="container">
  <div class="sliding-background"></div>
</div>

в .css файле:

.container {
  overflow: hidden;
}

.sliding-background {
  background: url("..path/to/image") repeat-x;
  height: 560px;
  width: 5076px;
  animation: slide 60s linear infinite;
}

@keyframes slide{
  0%{
    transform: translate3d(0, 0, 0);
  }
  100%{
    transform: translate3d(-1692px, 0, 0);
  }
}

см. Infinte-Scrolling-Background