JavaScript全屏无法滚动

我用下面的脚本对一个页面进行了全屏切换，但是当页面全屏时，我遇到了一个问题，它无法向下滚动。我尝试添加CSS

overflow:scroll

全屏显示，但什么也没发生

我希望有人能帮我。谢谢

HTML:

CSS:

---

供应商前缀必须在单独的CSS规则中（关于原因的讨论）

因此，在您的情况下，正确的CSS应该是：

body:fullscreen {
  overflow: scroll !important;
}
body:-ms-fullscreen {
  overflow: scroll !important;
}
body:-webkit-full-screen {
  overflow: scroll !important;
}
body:-moz-full-screen {
  overflow: scroll !important;
}

---

我不知道它是否回答了您的问题，但我为全屏滚动所做的是：

const elem = document.documentElement;
if (elem.requestFullscreen) {elem.requestFullscreen()}

不需要额外的CSS。在Chrome79上工作。

---

希望有帮助

我找到了一个简单的方法：将所有内容包装在块容器中（即

），然后设置以下css规则：

body {
    margin: 0px;
    height: 100%;
}
main {
   position: fixed;
   width: 100%;
   height: 100%;
   overflow-y: scroll;
}

---

然后在包装器元素上启动

requestFullscreen（）

方法。在Firefox 82和Chrome 86桌面和手机上测试。

你也可以发布你的HTML吗？@Mpalansch我也添加了HTML。仍然不工作。。滚动条出现，但无法滚动

body:fullscreen {
  overflow: scroll !important;
}
body:-ms-fullscreen {
  overflow: scroll !important;
}
body:-webkit-full-screen {
  overflow: scroll !important;
}
body:-moz-full-screen {
  overflow: scroll !important;
}

const elem = document.documentElement;
if (elem.requestFullscreen) {elem.requestFullscreen()}

body {
    margin: 0px;
    height: 100%;
}
main {
   position: fixed;
   width: 100%;
   height: 100%;
   overflow-y: scroll;
}