mobile - 移动 Safari 上的水平拖动

Question

也许我患有近视，只是看不出哪里出了问题，但我只有在移动 safari 中发生了一些奇怪的水平拖动（我在浏览器和我的 android 手机上检查了它，它工作正常。）我是想知道是否有人对如何防止这种情况发生有任何见解？该网站的链接是Yetisandbox

也许这是一个视口问题？我目前正在使用这个：

 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />

谢谢你的时间！

Answer 1

我也遇到了这个。这为我修复了它：

html, body{
    overflow-x: hidden;
}

Answer 2

.home-trail{
  ...
  width: 100%;
  position: absolute;
  ...
}
.home-intro{
  ...
  width: 1170px;
  margin-right: auto;
  margin-left: auto;
  ...
}

您的 .home-trail 容器具有 100% 的宽度和一个绝对位置。它的父 .home-intro 的宽度可能小于视口宽度，但位置是静态的。因为 100% 不是指 .home-intro 宽度。所以它的 100vw 但由于其父级的 margin-left 加上缺少的 left:0 属性而获得了一个左距离。