Question

嗨，首先，我是编程和这个网站的新手，所以请不要攻击我：）

所以，我刚刚开始一个新项目（具有Steam登录数据的赌博网站）该站点包含四个“游戏”（崩溃，骰子，Roulete，换购）。我目前正在研究轮盘赌，需要寻求帮助。我找到了与此相关的代码，并对其进行了修改以使其“完美”地工作。我在移动设备上浏览了该页面，但效果不佳，第一次旋转后，页面向后退了，动画完全崩溃了（移动了3个数字，依此类推。）。我尝试使用css（background-size：cover），但是它弄乱了像素并且没有旋转到正确的数字。我想，这段代码计算调整大小后的页面的背景宽度，并将其滚动到最合适的数字。

感谢您的帮助。

代码如下：

Scheduler

Answer 1

在您的CSS代码中看起来有些奇怪，包装器的宽度大于其子项，您可能需要首先对其进行修复。

从页面的响应速度来看，您只有2个项目大于屏幕宽度（.wrapper和.items），css文件底部的此媒体查询应该可以完成此工作：

@media only screen and (max-width : 1024px) {
  .wrapper {
    width: 100%;
  }
  .items {
    width: 100%;
  }
}

请不要忘记将此meta标签添加到html文件的头部：

<meta name="viewport" content="width=device-width, initial-scale=1.0">

如何使该动画具有响应性？

1 个答案: