显示全屏div时采用默认窗口滚动条

Question

我遇到全屏div的问题;它是一个切换，当这个div显示它占用浏览器窗口的全屏时。

问题是，滚动或使用时是浏览器窗口滚动条，它不会在全屏div （其中垂直方向较长）内导航，因此它仍然无用且难以用户体验。 似乎仍然在全屏div的背景中滚动浏览网站的整页内容。

我能够显示并嵌套一个额外的滚动条，显示div （使用溢出属性，但这不是我想要的），这样可行，但是你有两个滚动条，它和＆ ＃39;甚至更丑陋。 有没有让我的div在显示/显示时采取/允许使用默认浏览器窗口滚动条？因此，当显示时，用户可以使用默认滚动条向下和向上导航。

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

Answer 1

为正文添加新类。不要默认使用它。

.showTheDiv {
    overflow: hidden;
}

给div一个类：

<div class="divToShow">

将该类定义为：

.divToShow {
    display: none;
}

.showTheDiv .divToShow {
    display: block;
}

显示div使用：

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

希望这有效。