纯CSS无限滚动不适用于移动设备

时间:2019-04-22 09:50:44

标签: css

我正在使用CSS自动滚动全景图像。它适用于台式机,但不适用于移动设备。

这是我的代码:

.panorama-new {
  overflow: hidden;
  border-radius: 0.5rem;
  width: 100%;
  height: 560px;
}
.sliding-background {
  background: url(https://upload.wikimedia.org/wikipedia/commons/7/76/National_Stadium_panorama.jpg) repeat-x;
  height: 560px; /* original 560 */
  width: 16648px;
  animation: slide 60s linear infinite;
}
@keyframes slide {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(-8324px, 0, 0);
      }
}
<div class="panorama-new">
  <div class="sliding-background"></div>
</div>

0 个答案:

没有答案