显示全屏div以接受默认窗口滚动条

Question

我对全屏div有一个问题，这是一个切换，当这个div显示它占用了浏览器窗口的整个屏幕。

问题是，当滚动或使用浏览器窗口滚动条时，它不会在全屏幕div (在较长的垂直方向上)内导航，因此它仍然是无用的和丑陋的用户体验。它似乎仍然在全屏div的背景下从站点中滚动整个页面内容。

我能够用这个显示的div显示并嵌套一个额外的滚动条(使用overflow属性，但这不是我想要的)，这是可行的，但是您有两个滚动条，它甚至更丑。是否允许我的div在显示/显示时接受/允许使用默认浏览器窗口滚动条？这样，当显示时，用户可以使用默认滚动条向下导航和向上导航。。

也许解决方案是在显示时在全屏幕div中使用溢出滚动，然后隐藏默认的常规浏览器窗口滚动条？

Answer 1

为主体添加一个新类。不要默认使用它。

.showTheDiv {
    overflow: hidden;
}

给教务长上个课：

<div class="divToShow">

将该类定义为：

.divToShow {
    display: none;
}

.showTheDiv .divToShow {
    display: block;
}

要显示div用途，请执行以下操作：

$('body').toggleClass('showTheDiv'):

希望这能行。