Question

我已将背景图片添加到我的应用中。但是，当我滚动页面时，背景Stil停留在同一位置，否则显示为白色。滚动时该如何更改以在整个页面上显示图片？

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

CSS / HTML背景图片

1 个答案: