滚动折叠菜单Bootstrap中的内容

Question

我正在尝试找到一种简单的解决方案，以便在移动设备上折叠时从折叠菜单中提议内容的滚动。我的意思是，当菜单打开时，我想先提出折叠菜单的滚动条，而不是正文。

CSS对此有任何提示吗？还是只有JS脚本？

这是我的链接（请在移动视图中检查）

我的HTML代码：

 <a role="button" data-toggle="collapse" data-target="#NavbarCollapse" class="nav-link navbar-toggler hidden-md-up"><span class="icon-menu"></span></a>

<div class="row">
                      <div class="collapse navbar-toggleable-sm hidden-md-up col-xs-12" id="NavbarCollapse">
                        <ul class="nav navbar-nav text-center">
                          <li class="nav-item active col-xs-12"><a href="#">Tableau de bord</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Mon agenda</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Messagerie<span class="label label-primary label-pill">17</span></a></li>
                          <li class="nav-item col-xs-12"><a href="#">Mes patients</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Activité</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Mon cabinet virtuel</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Informations administratives</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Informations bancaires</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Informations profil</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Aide</a></li>
                          <li class="nav-item col-xs-12"><a href="#">Déconnexion</a></li>
                        </ul>
                      </div>
                    </div>

希望我的问题对你们清楚。非常感谢。

Answer 1

向侧边栏导航添加滚动功能。

#NavbarCollapse{
   max-height: 50vh;
   overflow-y: auto;
}