防止模式屏幕在移动浏览器中滚动

Question

我在一个移动页面上工作，我希望在用户定向到横向模式时显示类似模式的屏幕。 我正在使用div并基本上使它掩盖了屏幕，但是问题出在野生动物园中，用户可以滚动到div的顶部或底部，并使屏幕向上滑动并显示其下方的内容，然后弹回。

的CSS看起来像这样

{
  div {
    height: 100%;
    width: 100%;
    overflow: hidden;
  }
} 

我已经阅读了一些答案，可以在体内禁用此功能，但不能在其他元素上禁用此功能。 是否可以在特定的div上禁用这种怪异的滚动效果，或者是否可以解决此问题？

Answer 1

您的CSS无效，但是您关闭了。 实现所需的实际CSS类似于以下内容：

div {
    height: 100%;
    width: 100%;
    /* only the y axis (up down) has scroll and we only want that when the contents go out of bounds so the proper css property and value is to disable all scrolling just use the autoflow prop */
    overflow-y: hidden; 
  }

Answer 2

尝试：

div {
    height: 100%;
 width: 100%;
overflow: hidden; 
position:fixed;
 }