0

这是一个简单的 html 文档，其中有一个 div 由于水平平移而向右溢出了文档。但是因为溢出在 html 标签上被设置为隐藏，我希望没有滚动条。谷歌浏览器就是这种情况，但是当我在移动 webkit 或移动 safari 中加载此文档时，我可以滚动。这是一个错误吗？我怎样才能解决这个问题？

<html>
<head>
  <title>test</title>
  <style type="text/css">
    html {
      background: lightgray;
      overflow: hidden;
    }
    .test {
      width: 100%;
      -webkit-transform: translate3d(90%, 0, 0);
      height: 100px;
      background: grey;
    }
  </style>
</head>
<body>
<div class="test"></div>
</body>
</html>

要重现此问题，您可以在移动 safari 或移动 webkit 中打开此链接。您还可以通过打开 chrome 开发工具并启用设备指标覆盖来模拟移动设备来重现它。 https://dl.dropboxusercontent.com/u/78736800/overflowscrollbug.html

4

1 回答 1

0

您还应该隐藏body. 我进行了快速测试，这在移动 Safari 中起到了作用：

<style type="text/css">
html, body {
    background: lightgray;
    overflow: hidden;
}
.test {
    width: 100%;
    -webkit-transform: translate3d(90%, 0, 0);
    height: 100px;
    background: grey;
}
</style>
于 2013-10-17T01:19:47.943 回答